Unit 1 Overview

In this unit, we will set up your development environment, dive into key web development concepts, and kick off your first Express application. Units generally span two weeks in the semester-long (14-week) course and one week in the block (7-week) course. To stay on track, it is crucial to complete the activities in the presented order and on time. The prove assignments are the most important. If you have any questions or need help, do not hesitate to reach out to your team, teaching assistant (if available), tutor (if available), or instructor.

Part 1

Complete the following in the specified order by the due dates listed in Canvas or before the end of the unit if no date is listed:

• Environment Setup
  This guide walks you through setting up your development environment with essential tools like Visual Studio Code, Node.js, pnpm, and DB Browser for SQLite, ensuring you're ready for the course.
• JavaScript History
  Explore JavaScript's origins, evolution, and key advancements. This resource offers remediation for students to fill gaps in their understanding, while also serving as an introduction for beginners and a refresher for those with prior knowledge.
• Arrow Functions
  Learn about arrow functions, a concise way to write functions in JavaScript. This resource covers the syntax, features, and best practices for using arrow functions in your code. Your will be expected to write and use arrow functions in your assignments.
• Promises
  Dive into promises, a powerful feature in JavaScript for handling asynchronous operations. This resource explains how promises work, how to create and consume them, and how to handle errors. The Express framework uses promises extensively, so understanding them is crucial for building web applications.
• Modules
  Compare CommonJS and ES Modules, and learn how to create and use your own modules in JavaScript. This resource provides a solid foundation for organizing and reusing code in your projects. You will be expected to write ESM code in your assignments.
• Modern Nested CSS
  Discover the latest techniques in modern CSS, including nested rules, custom properties, and advanced selectors. These features allow you to write cleaner, more maintainable stylesheets while leveraging the full power of CSS for responsive and dynamic designs.
• Understanding File and URL Paths
  Learn the difference between absolute, relative, and root relative paths in file systems and web development.
• Skills Remediation

  The preceding learning activities reviewed JavaScript and CSS concepts you should have mastered in previous courses. If these concepts are not familiar to you, you will need to strengthen your understanding immediately using AI tutoring tools, online resources, or assistance from your team, teaching assistant, tutor, or instructor. Take action now to remediate any knowledge gaps so you do not fall behind in the course.

• Frameworks vs. Libraries
  Learn the distinct roles of frameworks and libraries in web development. Frameworks provide a structured approach to building applications, while libraries offer reusable code for specific tasks. Mastering both is essential for effective development.
• GitHub Repo
  This guide helps you set up and manage a Git repository for your project, covering installation and configuration of Git, creating a local repository, adding a .gitignore file, and pushing your project to GitHub. It also provides steps to verify your GitHub Pro student benefits and offers resources for further learning.
• Your First Express App
  In this assignment, you will set up a Node.js project using pnpm, add Express for a web server, and use Nodemon for automatic restarts. You will work with environment variables and create routes to practice building your first server-side rendered web app.

Part 2

Complete the following in the specified order by the due dates listed in Canvas or before the end of the unit if no date is listed:

• Request Response Lifecycle: Routing and Middleware
  Explore the request-response cycle in Express, examining how routing and middleware play a role in processing requests and sending responses. This resource provides insights into how these components work together to handle client-server interactions effectively.
• 3-Tier Architecture
  Learn about the 3-tier architecture, a design pattern that separates applications into three interconnected layers: presentation, logic, and data. This resource explains the benefits of this architecture and how it is applied in modern web development to create scalable and maintainable applications.
• Intro to Routing
  In this assignment, you will build a 3-page website using Express, learning how URLs map to specific routes in your application and how Express serves static files like HTML and CSS.
• Templating Engines (EJS)
  Discover how templating engines like EJS simplify the process of creating dynamic web pages by embedding JavaScript code into HTML templates. This resource explains the basics of EJS, its integration with Express, and how to use it to build server-side rendered applications with reusable and maintainable templates.
• Templating Engine (EJS)
  Learn to use the EJS templating engine with Express to generate dynamic web pages. This assignment covers creating reusable partials for common elements like headers and footers, and structuring your views directory for layouts and maintainable code.
• Live Reloading
  This guide demonstrates how to set up live reloading for your Express application using WebSockets and nodemon. Live reloading automatically refreshes your browser during development, streamlining your workflow by removing the need for manual page reloads.