All I can learn in a month...

Help me to plan a 30 days of intense learning experience in front end skills

I'll be on staycation next month, and I'm planning study as much as possible this month. I'm 40 years old, and I decided to move on my career to development.

I currently work in a bank, I have some knowledge of HTML, CSS and (superficial) Javascript. I just fished my Responsive Web Design Certification on freeCodeCamp.

I confess I'm a bit lost, just realized how much I have to learn. I can't waste this precious time. So I want to be well prepared to study the entire month focused on what is worthy.

So please give me some tips, in what should I focused, how can I concetrate on a quick improvement of my skills!!!

Tips

Tom Valorsa

Jul 24

OK, well first up I think you will get much more out of your month of study if you narrow the scope of what you look at. Things like Docker/PWA/YAML are all interesting but not essential for frontend, so I’d focus on the fundamentals (HTML/CSS/JS) and maybe look at one framework. Some ideas:

HTML/CSS

• Pick some simple layouts from sites that you like and try to build them with plain HTML and CSS
  • Look for more complex examples as you get more confident and try to build those too
  • You could even design some layouts yourself and try to build them
  • This will help you get a feel for the building blocks you can use when building UI, which will apply to any framework you use in future
• Get a good understanding of the position and display properties in CSS
• Experiment with the different ways you can select elements (and others around them) with CSS selectors
• Read up on semantic HTML so you can get a feel for the tags you can use and when they make sense

JS


• Find a decent overall JS tutorial in one place and work through it from start to finish
  • I used codecademy years ago but not sure what else is available now
• Maybe work through some puzzles/problems on sites like codewars, and look at other people’s solutions, to get a better feel for how you can solve problems in different ways

Framework

Pick a framework/library to experiment with to see how people build larger apps (i.e. React/Angular/Vue).
I’m biased but I’d suggest React, as it’s very easy to get going with and you only need to master a few concepts to be productive with it. This will help you to understand the benefits that a framework can provide you.
Angular is good too but in my experience the learning curve is a bit steeper and that might not fit with your timeframe. I’ve dabbled with Vue as well but can’t really speak to that, so will let someone else chime in.

MDN is your new best friend 🎉 If you want to understand more about a CSS property, or a JS function etc just Google "MDN blah" and you should be able to find detailed info.

Good luck!

Comments

[Tom Valorsa]

What are your goals for this month? What kind of position do you want to be in at the end?

[André Duarte]

Goals:

1. Be confident using HTML, CSS and JavaScript
2. Understand concepts I don't know well (Docker, PWA, Frameworks, webpack, yaml, etc)

Position : In condition of contribute in a real project

[Tom Valorsa]

OK, well first up I think you will get much more out of your month of study if you narrow the scope of what you look at. Things like Docker/PWA/YAML are all interesting but not essential for frontend, so I’d focus on the fundamentals (HTML/CSS/JS) and maybe look at one framework. Some ideas:

HTML/CSS

• Pick some simple layouts from sites that you like and try to build them with plain HTML and CSS
  • Look for more complex examples as you get more confident and try to build those too
  • You could even design some layouts yourself and try to build them
  • This will help you get a feel for the building blocks you can use when building UI, which will apply to any framework you use in future
• Get a good understanding of the position and display properties in CSS
• Experiment with the different ways you can select elements (and others around them) with CSS selectors
• Read up on semantic HTML so you can get a feel for the tags you can use and when they make sense

JS


• Find a decent overall JS tutorial in one place and work through it from start to finish
  • I used codecademy years ago but not sure what else is available now
• Maybe work through some puzzles/problems on sites like codewars, and look at other people’s solutions, to get a better feel for how you can solve problems in different ways

Framework

Pick a framework/library to experiment with to see how people build larger apps (i.e. React/Angular/Vue).
I’m biased but I’d suggest React, as it’s very easy to get going with and you only need to master a few concepts to be productive with it. This will help you to understand the benefits that a framework can provide you.
Angular is good too but in my experience the learning curve is a bit steeper and that might not fit with your timeframe. I’ve dabbled with Vue as well but can’t really speak to that, so will let someone else chime in.

MDN is your new best friend 🎉 If you want to understand more about a CSS property, or a JS function etc just Google "MDN blah" and you should be able to find detailed info.

Good luck!

[André Duarte]

Thank you very much!

I'm sure your tips will help not only me but a lot of folks!

I specially like what you said about

good understanding of the position and display

and

Pick a framework

Ps. Someday we can drink a tea, I drink PGtips everyday!