Sveltekitapp
sveltekitapp
This is a sample notepad application that uses SvelteKit with TypeScript on the front-end (UI) and on the back-end (API).
Environment Prep
Once you have cloned the repo, you will need the following tools for local development.
Node and npm
You should install NodeJS and npm.
These are the current versions on the front-end components:
Visual Studio Code (VSCode) Setup
You can use any IDE, but here is what you need for VSCode. It was quite a challenge getting ESLint to work properly when the .eslintrc.js file is not in the root of the project - the trick was the "eslint.workingDirectories" setting. All the settings are included in the .vscode/settings.json file. I use VSCode open only to the root of the project with no other projects. I recommend the following VSCode extensions:
Environment Variables
Create a file in the root of this project called .env, and paste in the following:
# Encrypt server cookie.
VITE_SESSION_SECRET="32 character password here"
NPM Commands
Start Services
You can run these commands to start the services.
# Start the application.
npm run dev
# You can now open your browser to: http://localhost:8080/
Project Status
This project uses SvelteKit which is not at v1.0 yet as of (5/29/2020). You can see the status of the 1.0 milestone here.
Storybook currently doesn't fully support SvelteKit because of the common module imports, but it should soon.
Here are a few good resources on SvelteKit:
Additional Documentation
This is one repository of a few that demonstrate with different front-end frameworks how to build a notepad application with authentication. A few of the other repositories are:
