- Notes:
- Tentative calendar (weekly topics), subject to changes depending on the pace of the course.
- Notes (:file_folder:) involves material discussed in class.
- Reading (:book:) involves material that expands lecture topics, as well as coding examples that you should practice on your own.
- Misc (:newspaper:) is supporting material that is worth taking a look at.
- 📁 Notes:
- 📁 Notes:
- 📁 Notes:
- 📎 Topics: Let's build an ecommerce site from scratch
- 📁 Notes:
- 📰 Misc:
- 🔈 To Do:
- 📎 Topics: Programming patterns. MVC Pattern. Using MVC in our own server.
- 📁 Notes:
- 📖 Reading:
- 🔬 Lab:
- 📹 Videos
- 💡 Cheat sheet:
- 🔈 To Do:
- Express Practice Part 2,3 and 4
- Sign up for MLab
- 📎 Topics: Let's use what we have learned with node and express to build some real life applications.
- 📁 Notes:
- 🔈 To Do:
- 📎 Topics: Why do we use databases. Which database should we use? Let's setup a database.
- 📁 Notes:
- MongoDB (slides)
- Setup MongoDB
- Mongodb Atlas
- 📖 Reading:
- 🔬 Lab:
- 📰 Misc:
- 📹 Videos
- 💡 Cheat sheet:
- 🔈 To Do:
- 📎 Topics: How does our code talk to a database. How do you retrieve things from a database. How do you save things to a database.
- 📁 Notes:
- 📖 Reading:
- 📰 Misc:
- 📹 Videos
- 💡 Cheat sheet:
- 🔈 To Do:
- 📎 Topics: Let's help out our front end co workers by building a back end service for them.
- 🔈 To Do:
- 📎 Topics: React. Why do we use this tool.
- 📁 Notes:
- React
- React Step by Step (Slides)
- 📖 Reading:
- 🔬 Lab:
- 📰 Misc:
- 📹 Videos
- 💡 Cheat sheet:
- 🔈 To Do:
-
📎 Topics: React. Let's cover some more aspects of React.
-
📁 Notes:
-
🔈 To Do:
- React Children
- Lifecycle Methods
- HOC
- prop-types
- Conditional Rendering
- Fragments
- String Components
- New features. Research on your own.
- componentDidCatch
- Context API
- Hooks
- Suspense
- 📎 Topics: Why do we use this tool called webpack.
- 📁 Notes:
- Webpack (Slides)
- Step by Step
- 📖 Reading:
- 🔬 Lab:
- 📰 Misc:
- 📹 Videos
- 🔈 To Do:
- 📎 Topics: Why do we use this tool called create-react-app.
- 📁 Notes: +
- 📖 Reading:
- 🔬 Lab:
- 📰 Misc:
- 📹 Videos +
- 🔈 To Do:
- 🔈 To Do:
- 📎 Topics: Why does the software tool Redux exist. What are Redux reducers. How do we use Redux with React.
- 📁 Notes:
- Redux (slides)
- Redux Checklist (slides)
- Redux Bank Analogy
- 📖 Reading:
- 🔬 Lab:
- Explain this error
- Fork this project. Use the checklist to add redux to this simple app.
- 📰 Misc:
- 💡 Cheat sheet:
- 🔈 To Do:
- Lecture Slides
- Do Lab
- Use the checklist to complete the homework project
- Project Redux Reducers
- 📎 Topics: How do you change data in Redux.
- 📁 Notes:
- Redux Checklist - Changing Data (slides)
- Types of Components (slides)
- dispatch quasi source code
- 📖 Reading:
- 🔬 Lab:
- 📰 Misc:
- 💡 Cheat sheet:
- 🔈 To Do:
- Rules of reducers
- Slides (slides)
- Stand alone containers
- Slides (slides)
- Presentational vs Container Components
- 📎 Topics: Discuss what a spa is and the pros and cons. How does client side routing make spa's better. Walkthrough how to use React Router by doing the project.
- 📁 Notes:
- 📖 Reading:
- 📹 Videos
- 🔈 To Do:
- 📁 Notes:
- 📰 Misc:
- 📎 Topics: How do you use fetch with Redux. By default you cannot. We need to use another tool. What is that tool?
- 📁 Notes:
- 📖 Reading:
- 🔬 Lab:
- 📰 Misc:
- 📹 Videos
- 💡 Cheat sheet:
- 🔈 To Do:
- 📎 Topics: Let's design a web app that is similiar to Netflix.
- 📁 Notes:
- 📹 Videos
- 🔈 To Do:
- 📎 Topics: Authentication. Sign-up/sign-in process. Hashing, tokens and encryption.
- 📁 Notes:
- 📖 Reading:
- 🔬 Lab: +
- 📰 Misc:
- 📹 Videos
- 💡 Cheat sheet: +
- 🔈 To Do:
- 📎 Topics: How do you get your application on a public web server for everyone to see. What is heroku?
- 📁 Notes:
- 📰 Misc:
- 📹 Videos
- 📎 Topics:
- 📎 Topics: What do you need to do to prepare for an interview. What should be on your resume.
- 📁 Notes:
- 📖 Reading:
- 🔬 Lab:
- 📰 Misc:
- 📹 Videos +
- 🔈 To Do: +
- 📎 Topics: How do we figure out what is wrong with our code.
- 📎 Topics: Make an app for iOS. Make an app for React Native
- 📁 Notes:
- 📖 Reading:
- 📰 Misc:
- 📹 Videos
- 🔬 Lab:
- 📎 Topics: How do you think through and solve coding challenges.
- 📁 Notes:
- 📖 Reading: +
- 📹 Videos +
- 📎 Topics: Let's make it fast.
- 📁 Notes:
- 🔬 Lab:
- 📎 Topics: NodeJS. What is it and why do we use it.
- 📁 Notes:
- 📖 Reading:
- 🔬 Lab:
- 📰 Misc:
- 📹 Videos
- 🔈 To Do: +
- 📎 Topics: npm. What is a package. What is a manager of packages.
- 📁 Notes:
- 📖 Reading:
- 🔬 Lab:
- 📰 Misc:
- 📹 Videos
- 🔈 To Do: +
- 📎 Topics: What is CORS. Why do we care about it. How do we handle it.
- 📁 Notes:
- 📖 Reading:
- 🔬 Lab:
- 📰 Misc:
- 📹 Videos
- 🔈 To Do:
- 📎 Topics: How do you learn things.
- 📁 Notes:
- 📖 Reading: +
- 🔬 Lab:
- 📰 Misc: +
- 📹 Videos +
- 🔈 To Do: +
- 📎 Topics: Let's explain the concept of asynchronous
- 📁 Notes:
- 📖 Reading: +
- 🔬 Lab:
- 📰 Misc: +
- 📹 Videos +
- 🔈 To Do: +
- 📎 Topics: What is this thing called fetch.
- 📁 Notes:
- 📖 Reading:
- 🔬 Lab:
- 📰 Misc: +
- 📹 Videos +
- 🔈 To Do: +
- 📎 Topics: There are an infinite number of ways to write your code. The computer doesn't care how you code as long as it gets the job done. So how do you decide from the infinite choices how you should actually write your code.
- 📁 Notes:
- Quotes and semicolons
- MVC
- Promise
- 📖 Reading: +
- 🔬 Lab:
- 📰 Misc: +
- 📹 Videos +
- 🔈 To Do: +
- 📎 Topics: How can we make webs pages work without internet connection? What is a Service Worker.
- 📁 Notes:
- 📖 Reading:
- 📰 Misc:
- 📎 Topics: What makes a web app be considered a progressive web app. Why would you want to make a PWA.
- 📁 Notes:
- 📖 Reading:
- 📰 Misc:
- 📎 Topics: Use these resources to get some inspiration for your final project.
- 📁 Notes:
- 📖 Reading:
- 🔬 Lab:
- 📰 Misc: +
- 📹 Videos +
- 🔈 To Do:
- 📎 Topics: Introduction, course in a nutshell, and policies/logistics. Please spend some time outside class to review the course policies and other guidelines.
- 📁 Notes:
- Survey
- Intro
- You're Hired
- Learning
- Final Project
- Review Javascript
- Setup
- Reusability
- Textbook, rocket chat, study groups, class format
- 📖 Reading:
- 📰 Misc:
- 🔈 To Do:
-
📎 Topics:You can use all the buzz words and cool terminology that you want, but when it comes down to it, all we are doing is building a software system. What specific types of software are we making and what kind of tools are we using to help us.
-
🌆 Objective: Understand what nodejs is.Understand what npm is. Be able to create an npm package.
-
📁 Notes:
-
📖 Reading:
-
📰 Misc:
-
🔈 To Do:
- 📎 Topics: What is TDD. How do you test your code. How do you test React. What is enzyme.
- 📁 Notes:
- 📖 Reading:
- 📰 Misc:
- 🔈 To Do:
- 📎 Topics: What is debugging. How do you debug a node app. How do you debug a web app.
- 🌆 Objective: Be able to use vscode and chrome to set breakpoints and debug a running javascript program.
- 📁 Notes:
- 📖 Reading:
- 📹 Videos
- 🔬 Lab:
- Debug Node vs Web
- Fix Bug
- Debug redux action practice
- Search All files
- Challenge
- Node debug practice
- 🔈 To Do:
- 📁 Notes:
- Modules(slides)
- Node Modules
- ES6 Modules
- 📖 Reading:
- 📹 Videos
- 🔈 To Do:
- 📎 Topics: Internet. Servers. Client-Server communication. Express. Rest.
- 📁 Notes:
- 📖 Reading:
- 🔬 Lab:
- 📰 Misc:
- 📹 Videos
- 💡 Cheat sheet:
- 🔈 To Do:
- 📎 Topics: Internet. Servers. Client-Server communication. Express. Rest. Continue learning how to use express step by step
- 📁 Notes:
- 📖 Reading:
- 🔬 Lab:
- 📎 Topics: Internet. Servers. Client-Server communication. Express. Rest.
- 📁 Notes:
- 📖 Reading:
- 🔬 Lab: