How to learn web development | JavaScript, CSS, HTML

Scrimba ยท Beginner ยท๐Ÿ›ก๏ธ AI Safety & Ethics ยท3y ago
๐ŸŽ“ View our courses: https://scrimba.com/links/all-courses Guil Hernandez is a developer and educator currently building immersive learning programs at Scrimba. With over 15 years of experience in the industry, he knows a thing or two about how to learn web development, and he's here to share his knowledge with you in this stream. ๐Ÿ–ฅ Contents ๐Ÿ–ฅ 0:00 - Introduction 2:22 - Can learning ability be improved? 5:32 - How do you build mental resilience? 11:56 - Note-taking tips 14:28 - I struggle with perfectionism when I'm trying to go 'off-piste' and build my own projects. Have you any advice on this? 17:07 - Is there such a thing as being too โ€œlateโ€ to learn how to code? 19:28 - Why do distractions happen and how can we prevent them? 21:56 - What to do when you need to learn something which doesnโ€™t interest you 24:40 - Do you think it is acceptable as a beginner to deliver a 'not 100% working as intended but does sort of work / adds some value' project in a business? 26:23 - How to make the most of criticism / not take it personally 30:09 - How long will it take me to learn web development? 32:20 - How can I learn if I don't have too much time available? 34:10 - How to plan ahead with your code / How to approach a solo project as a beginner 37:48 - How do I get interested in learning again after a tragic occurrence? 39:26 - Tips on writing more organized code 41:15 - How do you choose what you want to focus on / become in tech, given the different fields one can choose from? 42:46 - Frontend or backend - is there an order of what to learn first? 44:14 - Any tips on how to leave good comments for yourself and others when coding? (Intro to clean code Scrimba course: https://scrimba.com/learn/cleancode) 45:30 - How does self-esteem affect learning? 47:55 - How to maintain mental health in this industry? 49:29 - Do you ever get headaches or brain fog at work, but have to keep working? How do you deal with that? 51:40 - The Scrimba Bootcamp: https://scrimba.com/bootcamp
Watch on YouTube โ†— (saves to browser)
Sign in to unlock AI tutor explanation ยท โšก30

Playlist

Uploads from Scrimba ยท Scrimba ยท 0 of 60

โ† Previous Next โ†’
1 CSS Grid Course: Learn the Basics in 3 Minutes
CSS Grid Course: Learn the Basics in 3 Minutes
Scrimba
2 CSS Grid Course: Positioning Items
CSS Grid Course: Positioning Items
Scrimba
3 CSS Grid Course: Why Learn It And How It Compares To Bootstrap
CSS Grid Course: Why Learn It And How It Compares To Bootstrap
Scrimba
4 CSS Grid Course: auto-fit & minmax
CSS Grid Course: auto-fit & minmax
Scrimba
5 CSS Grid Course: Implicit Rows
CSS Grid Course: Implicit Rows
Scrimba
6 CSS Grid Course: Fraction Units And Repeat
CSS Grid Course: Fraction Units And Repeat
Scrimba
7 CSS Grid Course: Justify Items and Align Items
CSS Grid Course: Justify Items and Align Items
Scrimba
8 CSS Grid Course: An Awesome Image Grid
CSS Grid Course: An Awesome Image Grid
Scrimba
9 CSS Grid Course: Named Lines
CSS Grid Course: Named Lines
Scrimba
10 CSS Grid Course: auto-fit vs auto-fill
CSS Grid Course: auto-fit vs auto-fill
Scrimba
11 CSS Grid Course: Justify Content and Align Content
CSS Grid Course: Justify Content and Align Content
Scrimba
12 CSS Grid Course: Template areas
CSS Grid Course: Template areas
Scrimba
13 27. Setting up the structure - Responsive CSS Tutorial
27. Setting up the structure - Responsive CSS Tutorial
Scrimba
14 25. Making the navigation responsive - Responsive CSS Tutorial
25. Making the navigation responsive - Responsive CSS Tutorial
Scrimba
15 36. Playing with the title's position and negative margins - Responsive CSS Tutorial
36. Playing with the title's position and negative margins - Responsive CSS Tutorial
Scrimba
16 31. Starting the CSS for our page - Responsive CSS Tutorial
31. Starting the CSS for our page - Responsive CSS Tutorial
Scrimba
17 26. Taking a look at the rest of the project - Responsive CSS Tutorial
26. Taking a look at the rest of the project - Responsive CSS Tutorial
Scrimba
18 15. Spacing out the columns - Responsive CSS Tutorial
15. Spacing out the columns - Responsive CSS Tutorial
Scrimba
19 33. Starting to think mobile first - Responsive CSS Tutorial
33. Starting to think mobile first - Responsive CSS Tutorial
Scrimba
20 22. Making our navigation look good - Responsive CSS Tutorial
22. Making our navigation look good - Responsive CSS Tutorial
Scrimba
21 37. Changing image size with object-fit - Responsive CSS Tutorial
37. Changing image size with object-fit - Responsive CSS Tutorial
Scrimba
22 44. Module Wrap up - Responsive CSS Tutorial
44. Module Wrap up - Responsive CSS Tutorial
Scrimba
23 16. Controlling the vertical position of flex items - Responsive CSS Tutorial
16. Controlling the vertical position of flex items - Responsive CSS Tutorial
Scrimba
24 39. Setting up the widgets and talking breakpoints - Responsive CSS Tutorial
39. Setting up the widgets and talking breakpoints - Responsive CSS Tutorial
Scrimba
25 42. Setting up the About Me page - Responsive CSS Tutorial
42. Setting up the About Me page - Responsive CSS Tutorial
Scrimba
26 35. Changing the visual order with flexbox - Responsive CSS Tutorial
35. Changing the visual order with flexbox - Responsive CSS Tutorial
Scrimba
27 23. Adding the underline - Responsive CSS Tutorial
23. Adding the underline - Responsive CSS Tutorial
Scrimba
28 21. Using flexbox to start styling our navigation - Responsive CSS Tutorial
21. Using flexbox to start styling our navigation - Responsive CSS Tutorial
Scrimba
29 20. Creating a navigation - Responsive CSS Tutorial
20. Creating a navigation - Responsive CSS Tutorial
Scrimba
30 40. Using a new pseudo class to wrap up the homepage - Responsive CSS Tutorial
40. Using a new pseudo class to wrap up the homepage - Responsive CSS Tutorial
Scrimba
31 43. Fixing up some loose ends - Responsive CSS Tutorial
43. Fixing up some loose ends - Responsive CSS Tutorial
Scrimba
32 32. Starting the layout. Looking at the big picture - Responsive CSS Tutorial
32. Starting the layout. Looking at the big picture - Responsive CSS Tutorial
Scrimba
33 24. A more complicated navigation - Responsive CSS Tutorial
24. A more complicated navigation - Responsive CSS Tutorial
Scrimba
34 28. Feature article structure - Responsive CSS Tutorial
28. Feature article structure - Responsive CSS Tutorial
Scrimba
35 34. Styling the featured article - Responsive CSS Tutorial
34. Styling the featured article - Responsive CSS Tutorial
Scrimba
36 18. Making layout responsive with flex direction - Responsive CSS Tutorial
18. Making layout responsive with flex direction - Responsive CSS Tutorial
Scrimba
37 19. flex direction explained - Responsive CSS Tutorial
19. flex direction explained - Responsive CSS Tutorial
Scrimba
38 41. Creating the recent posts page - Responsive CSS Tutorial
41. Creating the recent posts page - Responsive CSS Tutorial
Scrimba
39 17. Media Query basics - Responsive CSS Tutorial
17. Media Query basics - Responsive CSS Tutorial
Scrimba
40 30. Home Page. HTML for the aside - Responsive CSS Tutorial
30. Home Page. HTML for the aside - Responsive CSS Tutorial
Scrimba
41 38. Styling recent articles for large screens - Responsive CSS Tutorial
38. Styling recent articles for large screens - Responsive CSS Tutorial
Scrimba
42 29. The home page.  HTML for the recent articles - Responsive CSS Tutorial
29. The home page. HTML for the recent articles - Responsive CSS Tutorial
Scrimba
43 10. ems and rems   an example - Responsive CSS Tutorial
10. ems and rems an example - Responsive CSS Tutorial
Scrimba
44 1. Starting to think responsively - Responsive CSS Tutorial
1. Starting to think responsively - Responsive CSS Tutorial
Scrimba
45 4. Controlling the width of images - Responsive CSS Tutorial
4. Controlling the width of images - Responsive CSS Tutorial
Scrimba
46 5. min width and max width - Responsive CSS Tutorial
5. min width and max width - Responsive CSS Tutorial
Scrimba
47 3  CSS Units.  Percentage - Responsive CSS Tutorial
3 CSS Units. Percentage - Responsive CSS Tutorial
Scrimba
48 11. Flexbox  refresher and setting up some HTML - Responsive CSS Tutorial
11. Flexbox refresher and setting up some HTML - Responsive CSS Tutorial
Scrimba
49 12. Basic Styles and setting up the columns - Responsive CSS Tutorial
12. Basic Styles and setting up the columns - Responsive CSS Tutorial
Scrimba
50 8. The Solution Rems - Responsive CSS Tutorial
8. The Solution Rems - Responsive CSS Tutorial
Scrimba
51 14. Setting the columns widths - Responsive CSS Tutorial
14. Setting the columns widths - Responsive CSS Tutorial
Scrimba
52 2  CSS Units - Responsive CSS Tutorial
2 CSS Units - Responsive CSS Tutorial
Scrimba
53 7. The problem with ems - Responsive CSS Tutorial
7. The problem with ems - Responsive CSS Tutorial
Scrimba
54 6. CSS Units. The em unit - Responsive CSS Tutorial
6. CSS Units. The em unit - Responsive CSS Tutorial
Scrimba
55 13. Adding the background color - Responsive CSS Tutorial
13. Adding the background color - Responsive CSS Tutorial
Scrimba
56 9. Picking which unit to use - Responsive CSS Tutorial
9. Picking which unit to use - Responsive CSS Tutorial
Scrimba
57 Tutorial to Learn Alpine JS - Full Course for Beginners
Tutorial to Learn Alpine JS - Full Course for Beginners
Scrimba
58 Guide To Algorithms in Javascript [Binary Search] - Full Course / Tutorial
Guide To Algorithms in Javascript [Binary Search] - Full Course / Tutorial
Scrimba
59 Learn UI Design [7 Fundamentals Tutorial] - Full Course for Beginners
Learn UI Design [7 Fundamentals Tutorial] - Full Course for Beginners
Scrimba
60 Javascript Tutorial for Beginners [From 0 to ES6+] - Full Course
Javascript Tutorial for Beginners [From 0 to ES6+] - Full Course
Scrimba

Related AI Lessons

โšก
We Have No Clue What Goes On Inside AI's Brain. This $1.25 Billion Startup Is Trying To Find Out
Goodfire, a $1.25 billion startup, aims to solve AI's black box problem, making AI decision-making more transparent and trustworthy, crucial for high-stakes applications
Forbes Innovation
โšก
The silent sequential skip: a failure class every AI pipeline should name
Learn about the silent sequential skip failure class in AI pipelines and how to identify and mitigate it
Dev.to AI
โšก
When an Algorithm Decided I Wasnโ€™t Me
Explore the implications of AI detectors on authorship and identity, and why blind trust in algorithms can be problematic
Medium ยท AI
โšก
Addictive AI Could Become The Next Big Business Risk
AI-driven digital products can be addictive, posing risks to mental health and customer behavior, making it a significant business concern
Forbes Innovation

Chapters (22)

Introduction
2:22 Can learning ability be improved?
5:32 How do you build mental resilience?
11:56 Note-taking tips
14:28 I struggle with perfectionism when I'm trying to go 'off-piste' and build my o
17:07 Is there such a thing as being too โ€œlateโ€ to learn how to code?
19:28 Why do distractions happen and how can we prevent them?
21:56 What to do when you need to learn something which doesnโ€™t interest you
24:40 Do you think it is acceptable as a beginner to deliver a 'not 100% working as
26:23 How to make the most of criticism / not take it personally
30:09 How long will it take me to learn web development?
32:20 How can I learn if I don't have too much time available?
34:10 How to plan ahead with your code / How to approach a solo project as a beginne
37:48 How do I get interested in learning again after a tragic occurrence?
39:26 Tips on writing more organized code
41:15 How do you choose what you want to focus on / become in tech, given the differ
42:46 Frontend or backend - is there an order of what to learn first?
44:14 Any tips on how to leave good comments for yourself and others when coding? (I
45:30 How does self-esteem affect learning?
47:55 How to maintain mental health in this industry?
49:29 Do you ever get headaches or brain fog at work, but have to keep working? How
51:40 The Scrimba Bootcamp: https://scrimba.com/bootcamp
Up next
Erfan Shayegani - Just Do It!? Computer-Use Agents Exhibit Blind Goal-Directedness
Cohere
Watch โ†’