Fix writeup to say port 5173 instead of 3000 for frontend

frontend/src/components/CheckButton.tsx

@@ -14,7 +14,7 @@ export interface CheckButtonProps {
  * Both come from the `public` folder--thanks to Create React App, anything in
  * that folder is automatically made available as a public file, so it's a good
  * place to store static icons and images. (You can also view the icons directly
- * in your browser by visiting, say, `localhost:3000/checkButton.checked.svg`.)
+ * in your browser by visiting, say, `localhost:5173/checkButton.checked.svg`.)
  */
 export const CheckButton = React.forwardRef<HTMLButtonElement, CheckButtonProps>(
   function CheckButton({ checked, disabled, onPress, className }: CheckButtonProps, ref) {

writeup/part-2/2-2-Task-detail.md

@@ -22,7 +22,7 @@ Next, we'll add a new frontend page that displays information about a particular
 2. Create a new file `frontend/src/pages/TaskDetail.tsx`. You can copy code from `Home.tsx` or `About.tsx` to set up the basic page outline. Make sure the exported function component is named `TaskDetail`.
 3. In `pages/index.ts`, add another line to re-export `TaskDetail` (like `About` and `Home`).
 4. In `frontend/src/App.tsx`, add a new [`Route` component](https://reactrouter.com/en/main/route/route) with path `"/task/:id"` and element `<TaskDetail />`.
-5. With the frontend running locally, test that the new page is reachable by entering the following URL in your browser: `localhost:3000/task/<id>`, where <id> is the ID of any Task object in your local database.
+5. With the frontend running locally, test that the new page is reachable by entering the following URL in your browser: `localhost:5173/task/<id>`, where <id> is the ID of any Task object in your local database.
 6. Within the `TaskDetail` component, add a state variable `task` which will store the Task object and add a `useEffect` hook which retrieves the task and puts it into that state variable.
    1. Use the [`useParams` hook](https://reactrouter.com/en/main/hooks/use-params) from React Router to get the task ID from the URL (this is called a [dynamic segment](https://reactrouter.com/en/main/route/route#dynamic-segments)). This ID should be the only dependency of the `useEffect` hook.
    2. Use the `getTask` function from `frontend/src/api/tasks.ts` to retrieve the task from the backend.

writeup/part-2/2-3-Task-assignment.md

@@ -25,7 +25,7 @@ Finally, we'll add the ability to assign users to tasks and see who is the assig
    <details>
    <summary><strong>❓ Hint: CORS errors</strong></summary>
 
-   _You might encounter a CORS (Cross-Origin Resource Sharing) permission error caused by the profile picture. This happens because browsers block requests for any resource that's not from the same origin (in our case, `localhost:3000`) by default for security reasons. You can ignore these errors and just use the example profile pictures that we provided (see [Part 2.1](./2-1-Users.md))._
+   _You might encounter a CORS (Cross-Origin Resource Sharing) permission error caused by the profile picture. This happens because browsers block requests for any resource that's not from the same origin (in our case, `localhost:5173`) by default for security reasons. You can ignore these errors and just use the example profile pictures that we provided (see [Part 2.1](./2-1-Users.md))._
    </details>
 
 4. Add styles to the `UserTag` component. You should just need some layout styling and a `border-radius` on the profile picture.