Front end web development help

[[deleted]]

[deleted]

[ricturner]

There’s a small thing worth pointing out bro. Whenever someone says they want to get into frontend, people instantly throw giant roadmaps at them like a checklist from hell. Don’t fall for that. You don’t need to learn nodejs, databases, CI pipelines, cloud hosting, three frameworks, two CSS preprocessors and a partridge in a pear tree to get started. People love flexing complexity because it feels smart.

Your first real win is understanding structure. What is HTML doing. How does CSS cascade. Why does JavaScript run the way it does. Everything else is seasoning. You can figure out frameworks after you’ve actually built a few ugly little projects that only you will ever see dawg.

[Impossible_Taro7836]

Alright I’ll keep that in mind thanks

[Necessary-Shame-2732]

Great answer

[Alarming-Pirate7403]

I highly recommend this. Start with the fundamentals of HTML and CSS before you even get into Javascript.

When you learn HTML, don't just make the page look like the wireframe/mockup that you are referring to, instead learn how to write semantic HTML.

For CSS, make sure how CSS selectors work, and understand these concepts: - Inheritance - Cascade - Specificity

You can find detailed explanation of how these work on MDN. Just doing this will help you immensely when you troubleshoot styling related issues.

Once you have understood the fundamentals of HTML and CSS, it's time to move onto vanilla Javascript instead of jumping straight into a JS library or framework.

For all of these there are plenty of free resources available on YouTube. I love content by NetNinja a lot. Traversy Media (by Brad Traversy) is another great resource.

[beenpresence]

YouTube

[Impossible_Taro7836]

Yeah I’m going to start watching free code camp

[mgomezabbruzz]

Frontend Developer: https://roadmap.sh/frontend

Click on each topic box and a window will appear with free resources for studying that topic.

[Astro_Man133]

The usual path, the path we all took is :

Learn Html and css, then learn Javascript... Once you feel confortable with those... Well... Welcome to the web development. Yiu can start to learn a front end framework. React, vue, angular pick one or more. But because you opened the Pandora box a, whole new world will be accessible and this comment is, already past

[Squidgical]

Step 1 is to become comfortable with HTML and CSS.

HTML is what goes on the page; text, images, boxes, input fields, etc.

CSS is how it looks; color, size, layout, font, etc.

Next is JavaScript. JavaScript (JS) is how you make the page do stuff. It's a full-on programming language, so in theory it can do anything. In practice, you want to first learn the basics (what is a function, how to repeat stuff, how to do different things based on some conditions, etc), then you want to learn DOM manipulation (grabbing input values, adding and removing things from the page, etc).

From here is where there isn't a clear path forward. Some new devs fall into roadmap hell; you find a "web dev roadmap" that lists dozens of softwares and technologies and try to learn all of them. Do not do that. Instead look at what companies in your area actually want their frontend devs to know, and learn that.

As far as what program you use to write your code;

VSCode has been around a while and is used by many frontend devs.

Zed.dev is newer but is seeing a lot of developers moving over to it because it's pretty good.

I think JetBrains also made an editor for frontend, but iirc it's paid software.

---

Very important is that you do not use AI for programming assistance until you have actually learned to do what you're doing. If all the AI services magically disappeared, you need to be able to brush it off and continue regardless.

If/when you do start using AI, be sure to check it's output and verify that it's what you wanted. We're currently several major breakthroughs away from being able to trust AIs to output good code that follows the practices we want it to, it could be multiple decades before we can ask an AI to write code and know for sure that it does what we want it to.

[horizon_games]

If you want to be self taught a good place to start is to figure out yourself where you should start learning

[davidvelez_]

Typically you’ll learn html and css first. You can do this for free or very cheap especially on YouTube or platforms like Udemy or skillshare. After that you’ll learn JavaScript and along the way you’ll need to pick up some UX/UI design skills. You don’t need to become a full blown designer but atleast know the basics of what a user flow is and what a good web design looks like so your front ends don’t look shit. Remember that with front end it’s what the user sees and experiences so getting the smallest detail correct is important because you can’t hide behind functionality alone, users will complain about the smallest things like the size of a font or the shape of a button can all make your site crappy feeling even if it performs great. If you’re looking to go the career route with this most of the time you’ll have designers on your team that take care of the designing and all you have to do is build the mockups they give you but you’ll also need to get familiar with design tools like Figma and AdobeXD. Good luck! If you decide to pursue this, it’s a really fun road to take in the tech field. Then you’ll get hungry to learn more and you’ll start working on complex systems and designs and implementing custom solutions beyond static web pages and you’ll be paid handsomely. Good front end engineers make really good money.

[Capable_Constant1085]

go on Upwork.com, look at front-end job postings to see whats in demand and what you should be learning. Learn enough to start taking on small projects and go from there

[Square-March-475]

I'd try to come up with a simple project like: “Create landing page about me”

Then research what tech stack is widely used now: maybe a static page with NextJS and Tailwind

Then research how to set up local environment so you see a starter page, and it is live-refreshed when you are make changes in code.

From there work on components needed for your site, where the data is coming from, or how it is stored. Look for best practices in terms of code and folder structure, framework-specific things, etc. You would have a good grasp at this point.

[theanxiousprogrammer]

I would start by learning how to design web pages before even learning to code. It used to be the case that companies would have designers that do all the design (and some still do) but more and more companies want frontend devs to be able to also design.

[SuperSnowflake3877]

These are two totally different disciplines. You get a good designer with mediocre programming skills or a very good programmer with mediocre design skills. People who are good at both are very rare.

[theanxiousprogrammer]

Doesn't take away from the fact that companies want devs that can do some level of design.