Tips for Getting Better at Frontend?

Hi all,

So I’m currently working through freeCodeCamp again after many failed attempts to get through the curriculum and time and time again I fail at the Frontend projects. I’ve skipped over them before and just worked through the algorithms and backend stuff. I feel there is so much to consider when working on the frontend (different screen sizes, responsiveness, accessibility, color theory, among many more.) Is there a cheat sheet for this stuff?

I have created full-stack web apps through MOOCs and in college where I would breeze through the backend but they always end up looking like trash. I always end up copying themes and layouts I find on other websites. I’m not sure how I can build an impressive portfolio without being able to create a nice looking frontend for my apps and websites.

Maybe web development is not for me? Sorry for the rant, I’m just extremely frustrated.

Any advice is appreciated. Thank you.

Look up YouTube tutorials on the projects. They usually walk you through and you use that knowledge to get better.

1 Like

Getting frustrated is all a part of the journey. It happens to all of us, believe me. Learning something new isn’t always easy, but you can only get better by working at it. From what you’ve mentioned in your post, you seem more than capable of figuring out and learning front end. Is there any particular section that you seem to get stuck at? Have you tried to narrow down why you are having difficulty getting through the curriculum or why you are skipping over the material?

1 Like

Thanks, I’ll definitely check some videos out. I always looked up general concepts but it never occurred to me to look up tutorials for the projects themselves.

Well I can get through the projects and meet the minimum requirements, but anything further like styling to make it look nice or making them responsive usually goes out the window.

I think I’m struggling to get through the curriculum because I always struggled with design/visuals. And I skip over the frontend projects and move to the backend because I get discouraged and want to move on.

Should I just do the minimum and move on and come back to it later once my skills improve? Or just stay on the frontend projects for as long as it takes to make them decent looking?

Yup! I got started with HTML/CSS back on MySpace as well. :smile:

Thank you for the advice! Glad to hear from people who are in similar positions. I’ll continue using other themes as inspiration and hopefully in time I’ll pick up enough to be able to do it on my own.

1 Like

I think you’re confusing what is required of a frontend dev. By that I mean that the “look” of an app will be given to you by the design team. You just have to know how to implement it with whatever tech stack is in the spec. And even then, they’ll give you dimensions, sketches, and stuff.

I’m not a designer, so what I do to make my projects look nice is one of these

As long as you don’t give the impression that you designed your projects, you’ll be fine. Unless you want to be hired as a designer. In which case my advice is non-applicable.

1 Like

Ah that is very reassuring to hear! Thank you for that link, I’ll definitely check it out! I definitely don’t have what it takes to be a designer and but if I am given a design or layout, I’m sure I could implement it.

1 Like

Yeah, I think freecodecamp should make this clearer. I spent a couple of months trying to learn design until my friend who’s a working dev told me he gets designs handed to him. :man_facepalming: lol

It’s a good idea to learn about UI/UX/design anyway, even if you end up working with a designer, since it’ll give you some understanding about what they do, and it’ll allow you to be more critical, and potentially influential, on the designs that you get from them. And being a developer who understands UI/UX/design will make you more valuable. If you want to learn more about the subject, these courses on Lynda are hands-down the best resources that I learned the most from:

https://www.lynda.com/User-Experience-tutorials/User-Experience-Fundamentals-Web-Design/421802-2.html
https://www.lynda.com/Accessibility-tutorials/Foundations-UX-Accessibility/435008-2.html
https://www.lynda.com/Web-Responsive-Design-tutorials/Responsive-Design-Fundamentals/104969-2.html
https://www.lynda.com/HTML-tutorials/HTML-Essential-Training/170427-2.html
https://www.lynda.com/HTML-tutorials/HTML5-Structure-Syntax-Semantics/182177-2.html
https://www.lynda.com/Web-Interactive-CSS-training/CSS-Page-Layouts/86003-2.html
https://www.lynda.com/Sketch-tutorials/UX-Foundations-Multidevice-Design/674602-2.html

Although Lynda’s not free, you should be able to get through all of these courses during their 30-day trial period—and some public library systems do offer free organizational access to Lynda, so that’s something you could look into.

Additionally, these courses on Coursera were very helpful for me in learning about responsive web design and are actually the first courses that I took on the subject before I got into Lynda:


4 Likes

Wow! Thanks for a list of all those courses! Yes, I really want to learn more about UI/UX/design even if I don’t plan on being a designer, I think it is important to have at least some knowledge of every role and not just the one you get hired for.

I will definitely check out my local public library to see if they offer access to Lynda and will work through those Coursera courses in the meantime.

Thanks again!

You should checkout this free course I took on udemy. Helped me a great deal. Plus you can run through the whole course in less than two hours.
Also why spend time trying to come up with good design when you can find free themes on themehunt and the like.

1 Like