This is a 5-day crash course project with dedicated 1-2 hours for each day whenever I could find time between my busy schedule.
To find more information about 5-day crash course newsletter, check out Brian Jenney's newsletter or register directly at https://www.parsity.io/noob
- Prep for crash course by:
- Scheduling time during the week or whenever you can
- VS code, if you are new to it
- HTML syntax is quite straightforward, so nothing much to add here.
idvsclassid: one id for one element at a time.class: one class can be used across multiple elements.
- margin vs padding
- margin adds space outside
- padding adds space inside
- cascading
- rendering precedence to bottom most element, if element present twice.
- Syntax:
selector { property: value; }
selector: what you're styling (body, h1, .class, #id)property: what you change (color, font-family, margin, etc.)value: how you change it (cornflowerblue, 20px, etc.)
No need to memorize every property. Learn patterns. Google + MDN = your best friend
-
Challenges completed:
- Stack user inputted text
- Add like and dislike buttons to act as counters
- Toggle background color
- Toggle between Show/Hide content
-
Learn by patterns. This is the pattern I followed:
- Plan HTML element
- Build it (Wait for the Styles!)
- Get the element
- Implement JavaScript functionality (
addEventListener) - If successful, then implement Styles.
-
Most common errors or issues I faced:
- Retrieving NaN values when trying to toggle between modes
- Forgetting syntax in all languages
-
Common troubleshooting that helped:
console.log()statements- Breaking down the issue into multiple micro-issues
- Web search the micro-issue
-
Most successful implementation:
- Toggle background colors (quite simple)
-
Everything else, more or less I had to look up for the syntax while I laid down the pseudo code for the challenge
...coming soon...