Best way to learn front-end development as a designer?
Hello IH!
I'm a designer looking to dive into development, and I figured the best place to start is getting a good handle on HMTL and CSS.
I understand the basic structure of websites as I've been a UI designer for the past 8 years, so I know a little bit of HTML and CSS but nowhere near enough to actually be able to develop a front-end experience.
Where is the best place to start? I know of platforms like Udemy, Code Academy, etc. but I find that there are almost too many platforms to choose from, and within each platform too many courses. Which one has worked for you? If naming a platform, is there a specific course that you would recommend?
Flexbox Zombies is great, and it's totally free now (used to be something like $149). It will teach you the basics of styling a site with modern flexbox-based CSS through a series of gamified challenges.
I did all of my online coursework through Team Treehouse, but the course that really nailed down all of the frontend concepts at once was Express Basics with Andrew Chalkley.
Granted, this is more JavaScript-focused, but for me it was imperative to learn how to think of both HTML and CSS more modularly. Without actually stringing together a single page application, the pursuit of modular markup seems almost arbitrary—like, what's the point?
But once you understand the benefits of working modularly, you see that it's not just a way of making your own job a bit easier, but adding loads of value to the application (or website) as a whole.
Udemy turned the status of many paid web development course into free category for a limited time. Maybe for quarantine days. You should consider. Many YouTubers are also very effectively teaching front end web development tutorials.
Brett, All the best with your learning.
At any time, if you feel like you need a mentor, feel free to reach out to us.
Our current intern @weekash developed our website https://www.horizontech.dev
You don't need any training to learn HTML, basic HTML tags are enough for most tasks. Even senior devs most of the time use basic tags. For others you can google/stackoverflow.
https://www.w3schools.com/html/ in this link you don't need to go beyond HTML Layout.
The biggest thing you learn/realize in HTML/CSS world is that there are more than one way to achieve something, that caused all the mess in HTML/CSS. With experience you will learn how not to messup things.
CSS is the one you need to learn/master.
The most complex thing in CSS is layout, if you understand the below link you know everything you need to learn in CSS Layouting.
https://css-tricks.com/snippets/css/a-guide-to-flexbox/
You don't need any paid training to learn this stuff.
I got my start with https://www.freecodecamp.org/ and the Responsive Web Design certificate. But also for you, as a designer, why not use a design tool where you can export the HTML and CSS? This would give you perfect examples.
Thanks! Looking into this now.
And actually I'm a long time Webflow user so I can build a lot of front-end experiences in there but there will never be a substitute for the need to know and understand custom code. I can go pretty far with Webflow, but as soon as something custom is needed, I get blocked.
Awesome, but really I meant that by being able to create simply styled divs in Webflow, for example, you can look at the CSS and see the relevant properties to get some idea of what's used in the design.
Learn Flexbox and Grid asap, and also check out https://css-tricks.com/
This comment was deleted 5 years ago
This comment was deleted 6 years ago