DEV Community

Cover image for Responsive Landing Page with ReactJs & Scss
Sudhanshu Ambastha
Sudhanshu Ambastha

Posted on • Updated on

Responsive Landing Page with ReactJs & Scss

Responsive Landing Page with Reactjs & Scss

This project is a responsive landing page built using React.js. It is based on a design available on Free CSS. The landing page features a header, main content section, and a footer. The main content section includes various sections such as About, Links, Tools, and Partners.

Certificate

Certificate

Technologies Used

My Skills

  • React.js: A JavaScript library for building user interfaces.
  • SCSS: A CSS preprocessor that adds features like variables, mixins, and nesting to CSS.
  • npm: A package manager for Node.js packages.

Usage

Feel free to modify and customize this landing page according to your needs. You can update the content, styles, or add new sections as required.

Note

This landing page is still incomplete as I am facing issues with the projects section in Styling(Scss). Being a high school graduate, I acknowledge that I have room for improvement in my coding skills. I am committed to working on it further to align it closely with the template link.

Credits

Design Inspiration: Free CSS - Aria Template

GitHub repo link:-Responsive Landingpage ReactJs Scss

This repository has received 3 stars, 14 clones, and 429 views, While many have cloned my projects, only a few have shown interest by granting them a star. Plagiarism is bad, and even if you are copying it, just consider giving it a star. Feel free to share your feedback or questions in the comments section.

Top comments (4)

Collapse
 
lewisblakeney profile image
lewisblakeney

This is a fantastic breakdown of building a responsive landing page with ReactJS and SCSS! The clear explanation and code examples make it a valuable resource for both beginners and experienced developers. A well-crafted landing page is crucial for any website, and this guide provides the perfect foundation for ReactJS development services to create impactful first impressions.

Collapse
 
litlyx profile image
Antonio | CEO at Litlyx.com

Great content!

Collapse
 
sayad-mallllek profile image
sayad-mallllek

I would suggest to deploy your project online on free hosting tools such as Vercel, Netlify, etc... (Fremium anyways). It would be much easier to see it as a demo and it would attract much more reach

Collapse
 
sudhanshuambastha profile image
Sudhanshu Ambastha • Edited

Actually, it's incomplete, as you can read in the note section, as my "project section" is not done yet. I am facing a problem with it, which is why I haven't deployed it yet. Thank you for your feedback. Also, because I haven't deployed it, I usually add a preview in GIF format, which you can see in the readme of this project on GitHub. To show how many people like this, I add the number of views and clones, as people don't often star it; most of the time, they just clone it for preview or personal use.