LarsGKodehode

1. Create a GitHub repo and link your project to that ( this is done automatically when creating a repo from inside VS Code ).
2. npm install --save-dev gh-pages
3. Add these two fields to packages.json inside the "scripts" object
    "scripts": {
        ...
        "predeploy": "npm run build",
        "deploy": "gh-pages -d dist"
        ...
    }

LarsGKodehode

// Importing the styles from our CSS module
import styles from './component.module.css'

// Since our custom components don't have the className field
// We have to think a bit differently about how to get the CSS classes
// we want to 'stick' to the right HTML element
function MyComponent(props) {
  const { className } = props

  return (

LarsGKodehode

Title of project

DELETE THIS: Single paragraph description of project

This is (going to be) the most awsome project ever and will be the Panacea for all the worlds problems.

Table of contents

• Overview
• Project Goals

LarsGKodehode

Your new best friend
- Integrated Development Enviroments (IDEs)

Why? Isn't Notepad enough?

While any text editor that does not do any fancy formating is technically usable for HTML, CSS and JavaScript. They lack several essential features that makes your everyday as a developer easier, notably:

• Syntaxt Highlightning
• Inteligent Code Completion

Setup

• Go trough here and follow the instructions

LarsGKodehode

Prettier
- VS Code Setup

Opinionated formatting.

Links

• Prettier

Steps

1. Have VS Code Installed
2. Get the extension here

LarsGKodehode

VS Code
- Basic setup for web development

Links

• VS Code

Steps

1. Go to this link
2. Chose the binary for your Operating System and download
3. Install

LarsGKodehode

Steps for setting up a Vite project

1. move the terminal to the correct folder where you want to create the new project
2. run $ npm create vite@latest
3. Set name of project, what framework you want to use, and which language
4. follow the instructions
   1. $ cd <name-of-project>
   2. $ npm install
5. $ code .

LarsGKodehode

Steps when working with Git

Content

• Everyday Workflow
• New Project
• Connecting to a Remote Repository
• Getting other peoples code
• Need More?

Everyday Workflow

LarsGKodehode

Your new best friend
- Integrated Development Environment (IDEs)

Why? Isn't Notepad enough?

While any text editor that does not do any fancy formating is technically usable for HTML, CSS and JavaScript. They lack several essential features that makes your everyday as a developer easier, notably:

• Syntaxt Highlightning
• Inteligent Code Completion

Setup

• Go trough here and follow the instructions

LarsGKodehode

Version Control System & Terminal
- Git, GitHub, Bash

Version Control System - Git
- How to keep track of changes over time?

Setup

Local steps

1. Install this