<aside> ❗ This page is a work in progress! We are currently working on flushing out all of the details in our lessons below, but hopefully these resources will provide you with a good point to start off learning more about web development!

</aside>

Introduction

Welcome to the Codebase Resources page! Here, you'll find a collection of lessons and projects that are based off of the resources that we give our students as part of the Mentored Project every semester in Codebase.

Despite a wide variety of resources out there for learning web development, it sometimes really hard to plan out which steps come before others and take the first step into making your first web application. This is what we had in mind when we created this; through this resource page, we hope to organize a lot of the information up there into a simple step by step series of lessons and projects that will build up your foundations in web development and software engineering.

In the Mentored Project, we learn by doing. The curriculum should be structured in a way where you can learn the basics of different parts of building a website, and have the opportunity to immediately exercise these skills in a small, related project. Currently, the main focus of the curriculum is full-stack web development with a React, Express, and Postgres stack.

Go ahead and get started!! There is a lot of room for exploration; we only go through the basics in each lesson, but hopefully it'll be enough to solidify your fundamentals so that you can continue to explore and learn other skills and technologies in the future!

Stage 1

In this Stage, you'll learn the main language we'll be using throughout the web application: JavaScript! We'll be also dipping into Git, the main tool that software engineers use to share and collaborate code. Finally, you'll get to exercise your JavaScript skills with your first project, p5!

Lesson 1: Picking up Javascript

Lesson 2: Git Basics

(Past) Project 1: p5 Project

Project 1: First Webpage

Stage 2

A major component of web development is figuring out how it should look, so we'll begin with learning one of the most popular design tools right now, Figma. Afterwards, you'll learn the two most crucial languages behind websites in general: HTML and CSS. Finally, you'll learn the most popular frontend framework, React, before building your own personal website!

Lesson 3: Figma

Lesson 4: HTML/CSS

Lesson 5: React

Project 2: Personal Website Project

Stage 3

Communication between different parts of a web application is done through something called APIs, so we'll be first diving into that. Afterwards, you can try out communicating with Airtable's APIs and integrating it with your personal website!