Skip to content

Commit

Permalink
chore: setup sp25 and run formatter
Browse files Browse the repository at this point in the history
  • Loading branch information
Destaq committed Jan 13, 2025
1 parent 6d3dabc commit 32fd16e
Show file tree
Hide file tree
Showing 11 changed files with 9,649 additions and 12,773 deletions.
259 changes: 166 additions & 93 deletions package-lock.json

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion versioned_docs/version-2024fa/finalproject.md
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,7 @@ For this milestone, you should have fully functioning prototype with maybe some

**Due: December 3rd, 2024 by 11:59 PM**

*Soft extension till Friday December 6th, 2024 by 11:59 PM*
_Soft extension till Friday December 6th, 2024 by 11:59 PM_

Submit your final work! Great job and we're all excited for demo day!!

Expand Down
16 changes: 8 additions & 8 deletions versioned_docs/version-2024fa/introduction.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,13 +15,13 @@ Learn to build and deploy scalable, modern full-stack web applications using bes

Email: [kyle.harms@cornell.edu](mailto:kyle.harms@cornell.edu)

## Instructors:
## Instructors:

**Chris Chen**
**Chris Chen**

Email: cc2785@cornell.edu

**Simon Illincev**
**Simon Illincev**

Email: sci24@cornell.edu

Expand Down Expand Up @@ -123,12 +123,12 @@ More details regarding the final project will be released upon starting the cour

First, we will determine your numerical grade. This will be done by the following:

| Assignment | Percentage of Grade |
| -------------------- | ---------------------------------------------------------------------- |
| Assignment | Percentage of Grade |
| -------------------- | -------------------------------------------------------------------- |
| Attendance | 20% (based on weekly lecture forms, can miss 1 of 9 without penalty) |
| Filling out Feedback | 10% |
| Final Project | 30% |
| Assignments | 40% |
| Filling out Feedback | 10% |
| Final Project | 30% |
| Assignments | 40% |

Your final grade will be determined by your numerical grade calculated above:

Expand Down
2 changes: 1 addition & 1 deletion versioned_docs/version-2024fa/lecture6.md
Original file line number Diff line number Diff line change
Expand Up @@ -112,4 +112,4 @@ Postman is an API platform used for building and using APIs.

This week's sample code starter can be found in the files under [this directory](https://github.com/cornell-dti/trends-mono-fa24/tree/main/demos/lec6).

The solution will be pushed to the same directory after lecture.
The solution will be pushed to the same directory after lecture.
1 change: 0 additions & 1 deletion versioned_docs/version-2024fa/lecture8.md
Original file line number Diff line number Diff line change
Expand Up @@ -304,4 +304,3 @@ addDoc(collection(db, 'tasks'), task);

Feel free to reference our [demo code](https://github.com/cornell-dti/trends-mono-fa24/tree/main/demos/lec8)
to implement authentication in your final project!

174 changes: 174 additions & 0 deletions versioned_docs/version-2025sp/introduction.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,174 @@
---
id: introduction
title: Syllabus
---

# INFO 1998: Trends in Modern Web Development

### Spring 2025

**Course Website**: [https://webdev.cornelldti.org/docs/introduction](https://webdev.cornelldti.org/docs/introduction)

Learn to build and deploy scalable, modern full-stack web applications using best practices and the industry's most-used technologies. This is a student run course by [Cornell DTI](http://cornelldti.org/)

**Faculty Advisor: Kyle Harms**

Email: [kyle.harms@cornell.edu](mailto:kyle.harms@cornell.edu)

## Instructors:

**Oscar Wang**

Email: [ow39@cornell.edu](mailto:ow39@cornell.edu)

**TBA**

Email: TBA

We also have many amazing TAs — TBA.

### Office Hours Schedule

The instructor and TA office hours schedule is as follows:

- TBA

Please note that some schedules may be subject to change; always check the latest comments under the pinned OH thread or the course website for the most up-to-date information.

## Credits and Credit Hour Options

1.0-credits, S/U

## Time and Location

This course meets once a week for 10 weeks for a total of 10 lectures.

We will meet weekly on Wednesdays, from **TBA** in **TBA**. The start of the class will start on **February 12th**.

<!-- \*\*You can find our course calendar with lecture dates and times, TA office hours with locations, and assignment due dates at [this](https://calendar.google.com/calendar/u/1?cid=Y183OTJmZmZmM2E3OWNjYTI2M2UwNTE2OTNmZDQ0YjlmMDI1NGQ4Y2JjYjk5YzUwODcxMmJkYmNhNDQ4YjMyODdlQGdyb3VwLmNhbGVuZGFyLmdvb2dsZS5jb20) Google Calendar link. -->

## Course Description

This class will teach students about modern web development technologies,
practices, and industry standards to better equip them for academic work,
research, interviews, internships, and full-time employment. By the end of this
course, you will gain key experience in designing systems on both the frontend
and backend using today's popularly applied technologies, including TypeScript, React, Firebase, and more.

## Pre/Co-requisites

Formally, there are no pre-requisites for this course:

**Pre/Corequisites: None.**

However, we _highly_ recommend that you have taken CS 1110, or have equivalent programming experience.

## Course Application

Apply [here (not open yet)](https://forms.gle/nshadTFzkzTenvjv8) by **TBA (early in the semester)**. It includes a general information questionnaire so we have the information necessary for enrollment, as well as a preassessment you must complete (see Pre-Course Assessment below).

We will be distributing enrollment/permission pins soon after the application period closes.

### Pre-Course Assessment

Please complete the pre-assessment [here](https://webdev.cornelldti.org/assets/files/preassessment-b10fef745a7d911c1d56342a90e7076b.zip). It should take
less than an hour! This is not meant as a test, but rather a way of ensuring
that you are familiar with the foundational material in the course.

Upload your submissions as a zip to your application [here](https://forms.gle/nshadTFzkzTenvjv8).

**This preassessment is mandatory; those who do not submit it will not be admitted in the course.**

## Course Objectives

By the end of the course, a student will be able to:

1. Develop dynamic, interactive web applications using frontend frameworks and server side rendering
2. Utilize standard API calls and traditional HTTP requests to transmit and retrieve data through the web
3. Design and implement various data models and utilize data manipulation techniques to represent data in web applications
4. Implement each aspect of a web application from frontend technologies to backend technologies and how to utilize middleware to communicate between the two
5. Develop and implement proper authentication methods to encrypt user data

## Course Materials

We highly recommend that you have a computer capable of running a modern web browser and text editor, as well as access to a stable internet connection.

## Assignments

Assignments are released after each lecture! There are 5 assignments total, which includes a final project spanning the last few weeks of the class.

You are allowed max 3 slip days (out of 6 total for all assignments and the final project) per an assignment.
**Please note that you are NOT allowed to use slip days for the final submission of the final project.**

The class is scheduled to finish well before finals week.

| Assignment | Topic | Due Date |
| ------------ | ----------------------- | ----------------- |
| Assignment 1 | JavaScript Fundamentals | Feb 26 by 11:59pm |
| Assignment 2 | TypeScript Fundamentals | Mar 12 by 11:59pm |
| Assignment 3 | React Fundamentals | Mar 19 by 11:59pm |
| Assignment 4 | Frontend Capstone | Mar 26 by 11:59pm |
| Assignment 5 | Final Project | May 4 by 11:59pm |

More details regarding the final project will be released upon starting the course.

## Method of Assessing Student Achievement

### Basis of Grade Determination

First, we will determine your numerical grade. This will be done by the following:

| Assignment | Percentage of Grade |
| -------------------- | -------------------------------------------------------------------- |
| Attendance | 20% (based on weekly lecture forms, can miss 1 of 9 without penalty) |
| Filling out Feedback | 10% |
| Final Project | 30% |
| Assignments | 40% |

Your final grade will be determined by your numerical grade calculated above:

**Satisfactory (S)** - 70% or higher

**Unsatisfactory (U)** - 69% or lower

Keep in mind that the class is S/U, and that a numerical score of a C- (70%) or
higher would allow you to pass with an S grade.

### Grading Scale

Web Development is a creative process, one that depends heavily on current technologies and how students decide to utilize them towards an end. Because of this, it is unnecessary to assign letter grades to students in this course. Rather, we will assign Satisfactory/Unsatisfactory grades. For a student to receive an Unsatisfactory grade, their numerical grade must be at or below 69% according to the numerical determination outlined above. Otherwise, they will receive a Satisfactory grade.

## Course Management

For the following sections, the word "us" refers to the course staff.

When in contact with us, contact with either of the two primary instructors (Sarah Young and Sophia Pham) is sufficient to qualify as contact with us.

The contact information can be found above in the "Instructors" section.

### Academic Integrity

**Each student in this course is expected to abide by the Cornell University Code of Academic Integrity:** [http://cuinfo.cornell.edu/aic.cfm](http://cuinfo.cornell.edu/aic.cfm)

Under the provisions of the Code, anyone who gives or receives unauthorized assistance in the preparation of work at home or during tests in class will be subject to disciplinary action. A student's name on any piece of work is our assurance that they have neither given nor received any unauthorized help in its preparation. Students may assist each other on assignments by answering questions and explaining various concepts. However, one student should not allow another student to copy their work directly. All University policies with respect to cheating will be enforced. A student who is found to have cheated on an exam, or any other graded assignment, will receive a "U” in the course.

### SDS Accommodations

**Students with Disabilities:** Your access in this course is important to us! Please request your accommodation letter early in the semester, or as soon as you become registered with Student Disability Services (SDS), so that we have adequate time to arrange your approved academic accommodations.

Once SDS approves your accommodation letter, it will be emailed to both you and us. Please follow up with us to discuss the necessary logistics of your accommodations using the contact information provided in this syllabus.
If you are approved for exam accommodations, please consult with us at least two weeks before the scheduled exam date to confirm the testing arrangements.

If you experience any access barriers in this course, such as with printed content, graphics, online materials, or any communication barriers, reach out to us or SDS right away.

If you need immediate accommodation, please speak with us after class or send an email message to us and SDS at [sds_cu@cornell.edu](mailto:sds_cu@cornell.edu).

If you have, or think you may have, a disability, please contact Student Disability Services for a confidential discussion: [sds_cu@cornell.edu](mailto:sds_cu@cornell.edu) or visit [sds.cornell.edu](http://sds.cornell.edu/) to learn more.

### Mental Health and Well-being

**Your health and wellbeing are important to us.**

There are services and resources at Cornell designed specifically to bolster undergraduate, graduate, and professional student mental health and well-being. Remember, your mental health and emotional well-being are just as important as your physical health. If you or a friend are struggling emotionally or feeling stressed, fatigued, or burned out, there is a continuum of campus resources available to you: [https://mentalhealth.cornell.edu/get-support/support-students](https://mentalhealth.cornell.edu/get-support/support-students).

Help is also available any time day or night through Cornell’s 24/7 phone consultation (607-255-5155). You can also reach out to me, your college student services office, your resident advisor, or Cornell Health for support.
35 changes: 35 additions & 0 deletions versioned_docs/version-2025sp/setup-editor.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
---
id: setup-editor
title: Setup your editor
---

# Install an Editor

We recommend using [VSCode](https://code.visualstudio.com/), which is free for students. Install it from the website.

Note: Course staff, instructors, and TAs will be using VSCode, so if you are using any other editors (such as [WebStorm](https://www.jetbrains.com/webstorm/)), you may need to do some extra work to get help from us.

## Recommended VSCode Extensions

To install extensions in VS Code, navigate to the left-hand sidebar, and click the building blocks icon near the bottom. This should take you to the Extensions marketplace.

### ESLint

Installing ESLint in VSCode will give you real-time linter feedback in any JavaScript code you write, allowing you to quickly pinpoint many problems and have readable, proper formatting.

Once installed, add these lines to your VSCode Settings (refer to [this link](https://code.visualstudio.com/docs/getstarted/settings) if you need help getting there or alternatively open the command palette in VSCode with <kbd>CMD</kbd>/<kbd>CTRL</kbd> + <kbd>SHIFT</kbd> + <kbd>P</kbd> and search `settings.json`):

```json
// Other settings ...
"eslint.alwaysShowStatus": true,
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
"eslint.packageManager": "yarn"
```

### Prettier

Prettier is a code formatter that will automatically format your code to be consistent with the rest of the class.

Install it and it should automatically work!
101 changes: 101 additions & 0 deletions versioned_docs/version-2025sp/setup-environment.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,101 @@
---
id: setup-environment
title: Setup your development environment
---

## Install Node.js

Node is a JavaScript runtime that allows you to run JavaScript code outside of a browser! It powers all of web development today, and is critically necessary for this course.

Go to [this website](https://nodejs.org/en/download/) and follow the instructions to install it on your workstation.

For consistency, please use the latest Node LTS (currently, as of Fall 2023, this is Node 18).

## Install `git`

Git is a version control system that allows you to track changes to your code and collaborate with others.

It is extremely likely that you already have git installed on your system. You can check this by running:

```bash
git --version
```

If this command fails, you can install git by going to [this website](https://git-scm.com/downloads) and following the instructions for your operating system.

## Install Additional Package

We will be using an additional package manager to help us with development.

#### Pnpm

Pnpm is a package manager that is faster and more efficient than the default `npm` package manager. (It caches everything.)

```bash
npm install -g pnpm
```

## REPL

To be able to follow along with / later try out the demos in class, you'll need a REPL (Read-Eval-Print-Loop). We just use Node for this.

The command you can run to enter Node in REPL mode is:

```bash
node
```

We highly recommend adding a flag to get rid of extra `undefined`s at the end of all lines.

```bash
node -e "require('repl').start({ignoreUndefined: true})"
```

## Running simple JS files

If you have a simple single JS file, you can run it with Node.

```bash
node your-file.js
```

Where `your-file.js` is the name of the file you want to run, **relative to the current directory**.

## Install `ts-node`

`ts-node` is a package that allows you to run TypeScript code directly from the command line.

```bash
npm install -g typescript
npm install -g ts-node
```

You can test that you have it installed by running:

```bash
ts-node -v
```

If you get weird `export {}` errors with `ts-node`, you can call with `ts-node your-file.ts --esm` / `ts-node --esm` or try using `npx` and `tsx` as alternatives:

```bash
npm install -g tsx
npx tsx your-file.ts # or `npx tsx` for REPL (interactive mode)
```

## Making a React Project

To make sure you've got everything set up correctly, `cd` into a directory of your choice and run:

```bash
pnpm dlx degit cornell-dti/trends-mono-fa24/frontend-starter your-project-name
```

This will create a new directory called `your-project-name` with a React project inside. `cd` into it and run `pnpm install` to install all the dependencies.

Take a look around and edit the code if you'd like.

When you're ready, run `pnpm dev` to start the development server. If everything works as it should, you should be able to navigate to `localhost:5173` and see a React app running!

You can also use that command to create a new 'blank' React project at any time. Bookmark this page and come back to it!
s
20 changes: 20 additions & 0 deletions versioned_sidebars/version-2025sp-sidebars.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
{
"docs": {
"Getting Started": [
{
"type": "doc",
"id": "version-2025sp/introduction"
},
{
"type": "doc",
"id": "version-2025sp/setup-editor"
},
{
"type": "doc",
"id": "version-2025sp/setup-environment"
}
],
"Lectures": [],
"Assignments": []
}
}
1 change: 1 addition & 0 deletions versions.json
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
[
"2025sp",
"2024fa",
"2024sp",
"2023fa",
Expand Down
Loading

0 comments on commit 32fd16e

Please sign in to comment.