Hi! Welcome to this beginner-friendly Frontend Engineering challenge for Hacktoberfest. A project focused on people getting started with frontend development.
Everyone is encouraged to participate, regardless of your skill level (If you don't have the required skills, use this project as a motivation to learn those!). This is a practice project and should be considered a playground.
You've to basically make components which are used often in a website. For eg. Navbar, Sidebar, Alert box, Carousel, Pagination etc. You'll definitely learn a lot from this project.
This project will be divided into two parts:
- Basic HTML,CSS and JavaScript.
- ReactJS
Make sure the code must be unique and valid otherwise it will not be accepted.
Please try to follow these guidelines:
-
Use only CSS/SCSS or Styled Components for styling the app, DON'T use bootstrap, material UI, semantic UI or any other styling library. (Haha! 😉 No shortcuts here 🤣)
-
Try to make the UI as elegant as possible, use Cards, box-shadows etc. Choose a subtle color-theme.
-
Prefer functional components over class components, use react hooks.
-
Unless absolutely necessary, don't use Redux for state management, try keeping things simple!
-
Only use images/content that are available for free and don't need any special license.
-
Last but not the least, use your imagination to build the coolest app you can think of ! 😻 🔥 🔥
Note 1: If you've never made a pull request before, or participated in an open-source project, we recommend taking a look at this wonderful video tutorial. And if you want a more complete tutorial on using github, creating branches etc. , here's a detailed video series.Once you've got your feet wet, you're ready to come back and dive into Hacktoberfest fun!
Note 2: Super Important Only the pull requests created between October 1st, 2021 and October 31st, 2021 will be counted!
-
Star this repository. 😛
-
And then you have to fork (make a copy) of this repo to your Github account.
-
Clone (download) your fork to your computer.
-
Set your streams so you can sync your clone with the original repo (get the latest updates)
-
git remote add upstream https://github.com/pcon-hacktoberfest-21/Basic-Components-of-a-Web-Layout -
git pull upstream main -
The above 2 commands will synchronize your forked version of the project with the actual repository.
-
-
Create a branch with your username.
-
Make the changes in your branch. For eg. You're creating a navbar using ReactJS and your username is xyz so you've to follow the path /ReactJS/Navbar/xyz/[YOUR_REACT_FILE] and same goes with others.
-
Commit and push the code to YOUR fork.
-
Create a pull request to have the changes merged into the origin.