Subject to change
There will be two phases:
- In Phase I, students will be introduced to each topic as briefly as possible while still giving them enough knowledge to build functional full-stack applications.
- In Phase II, students will go deeper on every topic to improve their idiom, learn best practices, and adopt professional workflows.
Both phases will end with time for students to practice what they've learned on capstone projects.
There will be a set of tutorial projects that will be continuously worked on throughout the course. As students learn new concepts, they will practice them by progressively enhancing each application. The tutorial projects include:
- LinkInBio: a Linktree-like personal page service.
- Must See Movies: a catalog of movies that users can browse and bookmark.
- VeryBest: a dish-centered restaurant review service.
- OfferUp: a Craigslist-like two-sided market.
- Photogram: an Instagram-like social network.
And others. We will not explicitly mention all of these projects as "practice" for every topic below, but most topics will be practiced by applying them to some or all of the tutorial projects, as well as any additional practice explicitly mentioned below.
For example, here is an early version of the social network tutorial project, when students are starting to learn how to implement basic CRUD. Here is a later version when they are learning Ajax. (To explore the latter, you can sign in using username: alice@example.com and password: password. )
The topics mentioned below are not necessarily covered linearly. For example, GitHub, Gitpod, HTML & CSS are taught concurrently because they don't make sense without each other. Topics are also revisited continously to add more depth, just in time for more complicated projects.
- Course overview
- Categories of software
- Software-as-a-Service
- What does "full-stack" mean?
- How to get
startupproject ideas
- Anatomy of HTTP requests
- URL structure
- HTTP verbs
- Response formats
- Practice: Making requests with Postman
- Domain modeling
- Gathering requirements
- User stories
- Wireframing with Figma
- Database design
- 1-N, N-N relationships
- Entity relationship diagrams
- Practice: database designs for MSM, Photogram, Very Best
- Recurring practice every week
- Programming environment
- The terminal
- Basic UNIX commands
- cURL
- Cloud-based development with Gitpod
- Local installation
- HTML & CSS basics
- Elements and hyperlinks
- Commonly used properties
- Layout modes
- Practice: Link In Bio, Personal Website, Rock Paper Scissors mockup
- Git basics
- Commits
- Branches
- Merging
- Pull requests
- Hosting with Heroku
- Deployment
- Custom domains
- Logging
- Practice: deploy your Link In Bio, personal website
- The Ruby language
- Basic classes
- Arrays
- Conditionals
- Loops
- Hashes
- Loading outside classes
- Our own classes
- Practice: reading/writing files, parsing CSV, scraping the web, interacting with APIs
- Web apps with Sinatra
- Routing & parameters
- View templates
- Static assets
- Practice: Rock-Paper-Scissors, Fortune Teller
- Bootstrap CSS
- Commonly used components
- Grid system
- JavaScript plugins
- Customizing
- Practice: re-write Link In Bio with Bootstrap
- Databases with ActiveRecord
- Migrations
- Querying
- Validations
- Associations
- Callbacks
- Practice: Must See Movies, Photogram
- Web apps with Rails
- Routing & parameters
- View templates
- Static assets
- Models
- Autoloading
- Forms
- Authentication
- Cookies
- Encrypting passwords with bcrypt
- Filtering requests with before_action
- Phase I capstone projects
- Intermediate Ruby
- Automated testing
- Rails helper methods
- Intermediate Git
- Scaffolds
- Code review
- Authentication with Devise
- Authorization with Pundit
- Continuous delivery
- Intro to JavaScript
- API development
- Ajax: HTML over the wire
- Ajax: JSON over the wire
- Introduction to React
- Introduction to React Native
- Phase II capstone projects