- other stuff not added: layout swap with modal/dialog window:
youtu.be/dcihFyjWYLI?list=PLHT1TNReACRcTbgiQQjku9kJLn47bzUZb
github.com/consultingninja/swapLayout
- important thing to note about ssr and csr:
youtube.com/watch?v=HGFl22daXzI
- summary it seems that if not in onmount then methods run on server+client (i.e. ssr)
- need to set ssr=false and have only csr
- route regular vs timeout vs instant:
- improve ux and dx of form. when error occurs show error and on edit remove error.
- regular shows error border right away but when you start editing, error message and style stays
- the timeout version has reactive
$:
where email is focus in error area- notice the cleanup ondestroy and timeout alternative approach
- this complicated approach will remove the red border after timeout
- instant or preferred way is use on:keydown
- for registration form example using mongo
github.com/consultingninja/svelteRegisterForm
youtube.com/watch?v=pwgLkAKp4Ik&list=PLHT1TNReACRcTbgiQQjku9kJLn47bzUZb&index=31&pp=iAQB
+ next five videos- notice registration video using the bcrypt to has password.
Everything you need to build a Svelte project, powered by create-svelte
.
If you're seeing this, you've probably already done this step. Congrats!
# create a new project in the current directory
npm create svelte@latest
# create a new project in my-app
npm create svelte@latest my-app
Once you've created a project and installed dependencies with npm install
(or pnpm install
or yarn
), start a development server:
npm run dev
# or start the server and open the app in a new browser tab
npm run dev -- --open
To create a production version of your app:
npm run build
You can preview the production build with npm run preview
.
To deploy your app, you may need to install an adapter for your target environment.