Frontend Development πŸ–₯️

study to become a frontend developer with most of the resources needed coming from Youtube

A frontend developer is a software developer who specializes in creating and implementing the user interface (UI) and user experience (UX) components of a website or web application. They focus on the client-side of web development, which involves coding and designing the visual and interactive elements that users directly interact with.

frontend roadmp from roadmap.sh

Understanding the Internet and how the technology works

Who is a frontend developer?

This section is intended to show you what frontend developers do and the skillset required to do what they do.

The Three Foundations [HTML, CSS, JavaScript]

In your journey to becoming a frontend developer, you will get to see these tools a lot and would have to learn them to perfection to be a good frontend developer. When learning these tools it is best to learn them in this other.

HTML course from freecodecamp

This next course is on CSS, it is quite time-consuming and totally worth it...

CSS course from freecodecamp

The next tool you would be needing is the legendary JavaScript, this is the major programming language you would be using as a frontend developer. JavaScript is so close to a front-end developer that it runs natively in the browser. JavaScrript can be used in the frontend and also in the backend, this resource would be focused on the use of javascript on the frontend.

JavaScript course from SuperSimpleDev

Version Control

Building a demo project from your portfolio is one thing and building a project for production is another thing. When building project for production you would have to introduce a "Version Control System"

Version control, also known as source control or revision control, is a system or methodology used in software development to manage and track changes made to a codebase or set of files over time. It allows developers to keep a history of modifications, collaborate effectively, and easily revert or merge changes as needed. Version control systems (VCS) provide a structured and organized way to handle the evolution of code and files within a project.

There are 3 major version controlling systems though they have some things similar to each other

  1. GitHub

  2. GitLab

  3. Bitbucket

GitHub, GitLab, and Bitbucket are popular web-based hosting services for version control repositories, primarily focusing on Git-based version control systems. While they share some similarities, each platform has unique features and target different user needs.

GitHub is the most used version-controlling tool in the opensource industries so I would be providing some resources to work with github

Github course from Academind

Github course for Opensource development

Open Source: How to course from freecodecamp

Web Security

Many might say security should be a more backend topic to consider, but it is not the case at least from my experience. From how you make calls to an API instfacture to how to make store authentication cookies. Security is a big topic to consider.

Frontend Security Video from Code labs Academy
Web Application Security from MIT

Typescript

After learning JavaScript, if you are coming from another programming background, you would see that there are some flaws that is binded to JavaScript as a programming language. These flaw are been sovled by TYPESCRIPT. You woulf likely never use JavaScript for production worthy development, we usally use TypeScript, that is why learning Typesript is necessary.

Typescript from Mosh
Typescript Course from freecodecamp

Introduction to a framework

Your current knowledge of HTML, CSS, JavaScript and TypeScript can build a "perfectly" working website but you would be carrying out some task repeatedly. With this, I would introduce you to the term framework.

A frontend framework is a software development framework that provides a standardized structure, tools, and libraries to streamline the process of building user interfaces (UI) for web applications. It simplifies frontend development by offering a set of pre-designed components, styles, and functionalities, allowing developers to focus on application logic rather than low-level implementation details.

In 2023, this are the most important frameworks a frontend developer should be using.

  1. ReactJS (this is a library but it deserve it)

  2. NextJS

  3. Tailwind css

  4. Chakra UI

I would only be droping video resource to React as the others, changes happen to them more frequently and you would need to learn the lastest to be relivant.

Last updated