sveltekit-workshop

KO | EN

gitlite — search

#javascript #typescript #android #linux #macos #java #windows #awesome #kubernetes #vue #awesome-list #ios #openai #open-source

sveltekit-workshop

(★ 21)

Repository including all the source code and information for This Dot's SvelteKit Workshop

sveltekit-workshop 최신버젼 다운로드

최종 버전 다운로드 (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# Delightful Web Development with SvelteKit

### SvelteKit Workshop by [This Dot Labs](https://thisdot.co)

Clone this repository to get started with the workshop.

## Recommended IDE Setup

[VS Code](https://code.visualstudio.com/) + [Svelte Extension Pack](https://marketplace.visualstudio.com/items?itemName=1YiB.svelte-bundle).

## Module Branches

There are different branches for each module and sub-module in the workshop. You can checkout the branch for the module you are working on by running the following command:

```bash
git checkout module-1

git checkout module-2.2
```

If you get stuck, you can checkout the branch with the appended `-solution` to the name. Solution branches are provided for each module and submodule.

Branches:  
`main`  
`module-1`  
`module-2.1`  
`module-2.1-solution`  
`module-2.2`  
`module-2.2-solution`  
`module-2.3`  
`module-2.3-solution`  
`module-2.4`  
`module-3.1`  
`module-3.2`  
`module-3.3`  
`module-3.4`  
`module-3.4-solution`  
`module-3.5`  
`module-4.1`  
`module-4.1-solution`  
`module-4.2`  
`module-4.2-solution`  
`module-4.3`  
`module-4.4`  
`module-4.4-solution`  
`module-4.5`  
`module-4.5-solution`  
`module-4.6`  
`module-5.0`  
`module-5.0-solution`  
`module-6.1`  
`api` (for local use API server)

## Workshop Outline

### Module 1: Svelte and SvelteKit

Learn about the relationship between Svelte and SvelteKit, what SvelteKit brings to the table.

In this module we will cover:

- Svelte and SvelteKit
- Setting up a new SvelteKit application for development

### Module 2: Routing

SvelteKit provides robust filesystem-based routing for your application.

In this module we’ll learn about:

- SvelteKit’s directory driven filesystem-based router
- Loading data for SvelteKit pages
- SvelteKit’s Layouts and Error Pages

### Module 3: Even more Routing

To be as flexible as possible, SvelteKit provides many routing features so you can create the URL structure you need

- Rest params, optional params and breaking out of layouts
- Routing Matchers
- Route Priority

### Module 4: Server Side Svelte

SvelteKit allows you to restrict and isolate code to only ever be run on the server, never exposing it to the client. With that understanding we will learn about:

- Using Secrets and Environment Variables
- Creating API endpoints
- SvelteKit Hooks

### Module 5: Forms

SvelteKit’s approach to forms and data mutation is simple: use the platform, then progressively enhance the experience. To facilitate that we will explore:

- Handling for submissions with SvelteKit Actions
- Enhancing forms with JavaScript on the client

### Module 6: Deployment

SvelteKit offers many options for how to build your site for production all the way down to the page level. In this module we’ll discuss:

- SvelteKits Page Options
- Adapters

### [Course Prerequisites]

- Computer with internet access
- A microphone and a webcam
- An IDE of choice (we will be using Visual Studio Code)
- Version 16+ or newer of Node installed on your computer
- Basic understanding of HTML and CSS
- Good understanding of JavaScript / TypeScript (all the examples will be in Typescript)
- Previous Knowledge of Svelte - the component framework SvelteKit is built on top of - is recommended

sveltekit-workshop

sveltekit-workshop 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

sveltekit-workshop

sveltekit-workshop 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

Download README