Web Development Basics

Learn HTML / CSS and Javascript and build your website. Understand the basics of the command line, git, Github, APIs and so much more.

Syllabus

1 Web 101

How does a website work? Understand client/server model and HTTP.

  • Introduction

    00:00
  • 2 machines communicating

    00:15
  • HTTP as a communication protocol

    00:37
  • Client/Server, Request/Response

    01:00
  • Clients sends a request

    01:19
  • Static response from server

    01:32
  • Dynamic response from server

    01:42
  • Client processes response

    02:03
  • Flow recap

    02:59

2 Code your website with HTML & CSS

Discover HTML, CSS and Bootstrap by coding a simple landing page.

  • Introduction

    00:11
  • Landing Page requirements

    00:58
  • Let’s build it from scratch

    03:47
  • Setup

    06:10
  • HTML - Basics

    11:40
  • HTML - Head & Body

    13:14
  • HTML - Core syntax

    19:20
  • HTML - Images

    28:05
  • CSS - Basics

    33:00
  • CSS - Syntax

    36:00
  • CSS - Colors

    37:25
  • CSS - Fonts

    39:35
  • CSS - Linking stylesheet to HTML

    42:20
  • CSS - Coolors

    47:11
  • CSS - Google Fonts

    49:05
  • Div & Box model

    52:58
  • Id & class

    1:01:37
  • Banner

    1:06:55
  • Font Awesome

    1:13:20
  • Bootstrap

    1:17:08
  • Bootstrap’s grid

    1:23:30

3 Build your UI library with CSS

Be the creator! Code your own UI components with advanced CSS techniques.

  • Introduction

    00:11
  • Discovering web components

    03:23
  • Setup

    13:22
  • Basic components - Avatars

    18:23
  • Basic components - Buttons

    23:30
  • Basic components - Dropdown

    31:37
  • Gradient filter

    40:07
  • Positioning

    43:51
  • Enhanced components - Card

    48:25
  • Enhanced components - Badge

    58:51
  • Flexbox

    1:00:03
  • Advanced components - Banner

    1:08:11
  • Advanced components - Tabs

    1:14:54
  • Advanced components - List items

    1:22:45

4 Terminal 101

Learn the basics of the Command Line. Discover a new way to speak with your computer.

  • Where am I?

    00:00
  • Where can I go?

    00:34
  • Navigate

    01:14
  • Create folders and files

    04:16
  • Rename or relocate a file

    05:27
  • Read the content of a file

    07:29
  • Remove a file

    08:01

5 git & Github for Beginners

Discover the tools we use every day as a developer when collaborating on a tech product.

  • Introduction

    00:11
  • Setup

    06:09
  • git - Start tracking changes

    09:43
  • git - First commit

    12:08
  • git - Second commit

    19:35
  • git - Branching

    24:40
  • git - Merge

    35:47
  • Remote

    41:19
  • GitHub - Adding a remote

    43:16
  • GitHub - Pushing code

    46:00
  • Github - Interface

    56:40
  • GitHub - Pull requests

    1:08:10
  • Github - gh-pages

    1:23:36
  • Github - Conflicts

    1:26:09

6 JavaScript for Beginners

Improve the UX of your website with animations and discover JS, your first programming language.

  • Introduction

    00:11
  • JS developer tools

    01:44
  • Data types

    09:32
  • Variables

    13:32
  • Conditions

    25:21
  • Loops

    45:13
  • Functions

    59:05
  • DOM for Document Object Model

    1:09:14
  • jQuery - DOM manipulation

    1:12:58
  • jQuery - Event handling

    1:20:45
  • jQuery - AJAX

    1:22:07
  • Resources

    1:28:20

7 APIs for beginners

Don’t reinvent the wheel! There’s an API for that. Understand what APIs really are and how to use them.

  • Introduction

    00:11
  • Google Maps JS API

    06:39
  • Twilio API

    11:59
  • TimeOut use case

    15:00
  • Geocoding sequence

    20:08
  • Send text messages

    25:28
  • Webhooks

    29:15
  • Example - Lead Management

    34:10
  • Zapier

    43:42

8 Technical Workflow for Startups

Work better, work faster, work together. Discover the workflow of the best tech startups.

  • Introduction

    00:11
  • Versioning

    02:57
  • Branching and Pull Requests

    08:43
  • Deployment

    21:49
  • Testing

    29:53
  • Continuous Delivery

    42:27
  • Backups

    53:35
  • Monitoring

    58:36
  • Tools

    1:01:08
  • Advice from a Developer

    1:09:39