Hey, techies. If you’re planning to venture into the web development field, you should know that there are 3 aspects involved in web development. We have the:
- Frontend Development: This is the part that’s referred to as the client’s side of the application. Frontend development is the development of the user interface of a website; the side users interact with.
- Backend Development: This is the part that’s referred to as the server side of the application. This is the side that takes care of the logic, scripting, and databases of a website or web app. Users do not interact with this side of the software.
- Full-stack Development: This is the development of both the front end and the backend side of a web app or website. Full stack developers make use of frontend technologies as well as, backend technologies.
This article serves as a thorough road map for front-end development, along with useful resources and materials.
Roadmap to frontend development
- HTML: HTML stands for HyperText Markup Language. It is a markup language used to create web pages. It is the building block of a web page.
- CSS: CSS stands for Cascading Style Sheets language and is used to style elements written in HTML. The colors, design, image sizes, position of items, and layouts of a website or web application is done using CSS.
- JavaScript: is a scripting language for creating dynamic web page contents. It’s used to improve user interaction/functionality with web pages.
NB: HTML, CSS, and JavaScript are the basic building blocks for front-end development.
- Git and GitHub: Git and GitHub are version control systems and development platforms respectively used to host projects, keep track of code changes, collaborate on projects, and sometimes, deploy projects.
- CSS Frameworks: A CSS framework is a ready-to-use CSS library that has been prepared. Instead of starting every project again from scratch, CSS Frameworks offer tools to quickly design a user interface that can be replicated or modified throughout projects. The CSS frameworks Bootstrap, Tailwind CSS, Bulma, Foundation, and many others are examples.
- JavaScript Framework/Library: A JavaScript framework is a JavaScript-written application framework that allows programmers to customize the functions and use them as needed. Frameworks make working with JavaScript easier and smoother, offering such possibilities as making applications device responsive. We have JS frameworks like React, Angular, Vue, and Ember. The most widely used JS framework for front-end development is react. I’ll only include resources for React in this article. You can always look for resources on different frameworks online.
- APIs: API stands for Application Programming Interface. By using a set of protocols, it makes it possible for two software components to communicate with one another. Most of the time, people assume that only backend developers need to understand APIs, however frontend devs also need to because they may need to fetch data for their client-side interface. An illustration is getting information from the openweather.org weather database to create a weather application. A city’s or a country’s meteorological conditions, such as rainfall, humidity, sunshine, and so on, can be retrieved as part of the weather data. In this situation, front-end developers can benefit from having an understanding of APIs.
You may always go further to advance your understanding of web development after learning these essential frontend development concepts by studying other frontend web technologies like jQuery, CSS Preprocessor like SASS or Less, Typescript, Redux, Nextjs, Material UI, Materialize, and so on. Although they are not required, having additional web skills might be useful, especially when looking for work.
Remember to always build projects while learning. It is the best way to learn and make sure you understand every concept of what you learned.
Having an accountability partner as a newbie in tech greatly enhances your growth in the tech field. Here are some of the benefits:
- Being held accountable by a partner might help you stay on track and increase your output
- Your accountability partner will assist you in achieving your goals and objectives by setting fixed deadlines.
- Having a discussion with your accountability partner can give you new perspectives on challenging coding issues
- Your accountability partner will be devoted to providing you with honest feedback, both positive and negative, just as you are committed to your goals.
Codum:
It is a great community to join if you’re in search of an accountability partner, mentorship opportunities and also a place to improve your skills.
Developers can benefit from joining tech communities, too. Here, you can network with people who share your interests, work together on projects, and find solutions to coding problems. I covered everything there is to know about tech communities in this article, including the advantages of joining them as a newbie in front-end development.
https://medium.com/@JulietOma/frontend-development-roadmap-9da8ae66c2f4
