Let's Code Champ 🙌

Code course for EGGS employees

This is a series of sessions that will be spread out through the Fall of 2020. The coding tool we will be using is CodeSandbox.io, so no need to install anything before the sessions.

Planned topics

HTML and CSS – Basics

HTML

• Basic HTML document structure
• HTML tags and attributes
• Linking pages and resources
• Adding stylesheets (CSS)
• Targeting styles with classes

CSS

• Paddings and margins
• Layout and positioning
• Styling to match a spec (figma)

HTML and CSS – Intermediate

• CSS animations and transitions
• Responsive CSS and media queries (dark mode)
• 3D effects

Javascript – Basics

• Variables
• Functions
• Conditionals
• Loops
• Manipulate HTML elements

Javascript – Intermediate

• Immutability, side-effects, pure functions and functional programming
• Using template literal strings as simple components
• Fetching data from an API
  • Calling an api with Javascript
  • Rendering HTML based on API results

React and modern web apps

• Your first React component
• JSX: It's like a function, but looks like HTML
• Node, Yarn and Parcel – setting it up on your own machine
• ESLint and Prettier for consistent code formatting and to follow best practices
• Hosting an app
  • Github Pages
  • Netlify

Simple back-ends

• Using Sanity.io for data storage
• How to set up a Sanity project
• Fetching from Sanity to an application
• Rendering based on data from Sanity

Git and GitHub

• It's like a journal for your code projects
• Git makes collaboration easier
• Parallel work tracks with Branches and Pull requests
• How to publish your website / app with GitHub Pages

Accessibility

• Rules of thumb

---

Unsorted topics

• Video elements