Embedded Files
Create a project folder with 2 sub-folders
BACKEND
Open backend folder in VSCODE and run:
npm init -y
npm i express mysql2 cors
npm i -D nodemon
"start":"nodemon server.js"
server.js
const express = require('express');
const cors = require('cors');
const app = express();
const port = 3000;
app.get('/', (req, res) => {
res.send('<h1>Hello, Express.js Server!</h1>');
});
app.get('/name', (req, res) => {
res.send({name: 'Mohammad Nizam Ibrahim'});
});
app.listen(port, () => {
console.log(`Server is running on http://localhost:${port}`);
});
Run server
npm start
PREPARE DATABASE in LOCAL
Create DATABASE
CREATE DATABASE IF NOT EXISTS sveltekit;
Create TABLE
CREATE TABLE IF NOT EXISTS users (
id INT AUTO_INCREMENT PRIMARY KEY,
name VARCHAR(50) NOT NULL,
email VARCHAR(20) NOT NULL UNIQUE,
password VARCHAR(20) NOT NULL
);
Insert RECORDS
INSERT INTO users (name, email, password) VALUES
('Alice', 'alice@example.com', 'password123'),
('Bob', 'bob@example.com', 'securepass456'),
('Charlie', 'charlie@example.com', 'mypassword789');
CRUD TO LOCAL DATABASE
server.js
...
//GET ALL USERS
app.get('/getUsers', async (req,res) => {
const sql = "SELECT * FROM users";
try {
const [rows, fields] = await pool.query(sql);
res.json({
success: true,
error: false,
message: 'GET ALL Request success',
data: rows,
});
} catch (err) {
console.log(err);
}
});
http://localhost:3000/getusers
server.js
...
//GET USER BY ID
app.get('/getUser/:id', async (req, res) => {
const id = req.params.id
const sql = "SELECT * FROM users WHERE id=?";
try {
const [rows, fields] = await pool.query(sql, [id]);
if (rows.length == 0){
return res.json({
success: false,
error: true,
message: 'User not found!',
})
}
res.json({
success: true,
error: false,
message: 'GET User ByID success',
data: rows,
});
} catch (err) {
console.log(err);
}
});
http://localhost:3000/getUser/2
Since, this is our first post method, add middleware to read json data
server.js
...
const app = express();
const port = 3000;
//MIDDLEWARE
app.use(express.json());
app.use(cors());
//CREATE NEW USER
app.post('/addUser', async (req, res) => {
const { name, email, password } = req.body;
const sql = "INSERT INTO users (name, email, password) VALUES (?, ?, ?)";
try {
const [rows, fields] = await pool.query(sql, [name, email, password] );
res.json({
success: true,
error: false,
message: 'CREATE User success',
data: {id: rows.insertId, name, email, password }
});
} catch (err) {
if (err.code === 'ER_DUP_ENTRY') {
res.status(400).send('Email already exists');
} else {
console.log(err);
}
}
});
http://localhost:3000/addUser
server.js
...
//UPDATE USER
app.put('/updateUser/:id', async (req, res) => {
const id = req.params.id
const { name, password } = req.body;
const sql = "UPDATE users SET name = ?, password = ? WHERE id = ?";
try {
const [rows, fields] = await pool.query(sql, [name, password, id] );
res.json({
success: true,
error: false,
message: 'UPDATE User success',
data: rows
});
} catch (err) {
console.log(err);
}
});
http://localhost:3000/updateUser/4
server.js
...
//DELETE USER
app.delete('/deleteUser/:id', async (req, res) => {
const id = req.params.id
const sql = "DELETE FROM users WHERE id = ?";
try {
const [rows, fields] = await pool.query(sql, [id] );
res.json({
success: true,
error: false,
message: 'DELETE User success',
data: rows
});
} catch (err) {
console.log(err);
}
});
http://localhost:3000/deleteUser/10
COMPLETED
c-PANEL
1. Prepare database (c-Panel)
2. Change connection to connect to external database in c-Panel
server.js
...
//CONNECT TO LOCAL DB
// const pool = mysql.createPool({
// host: 'localhost',
// user: 'root',
// password: '',
// database: 'sveltekit',
// });
//CONNECT TO EXTERNAL DB (cPANEL)
const pool = mysql.createPool({
host: 'localhost',
user: 'mlrguitm_XXXXXXXXX',
database: 'mlrguitm_XXXXXXXXX',
password: 'XXXXXXXXXXXX',
});
3. Zip all file EXCEPT node modules.
4. Create Sub-domain/Domain in cPanel
5. Setup Node.js App (1/2)
add "api-" for Application root (preference)
Test
https://sveltekit.mlrguitm.com/
6.
Delete all files in api-sveltekit folder
Upload and Extract zip file from (3)
7. Setup Node.js App (2/2)
Refresh (5)
STOP APP
Run NPM INSTALL
8. START APP again & Test
Error if START APP is not clicked/run
9. More Test (Thunder Client)
https://sveltekit.mlrguitm.com/getUser/1
COMPLETED
FRONTEND
npm create svelte@latest my-app
cd my-app
npm install
code .
npm run dev
npm install bootstrap
src/routes/+layout.svelte
<script>
import "bootstrap/dist/css/bootstrap.min.css"
</script>
<slot />
npm install axios
MAIN PAGE (Login)
src/routes/+page.svelte
<section class="container">
<h1 class="text-center mt-5 mb-3 text-success">Welcome to My App</h1>
<nav class="text-center mb-5">
<i>
<a href="/register">Register</a>
<a href="/">Login</a>
<a href="/crud">CRUD</a>
</i>
</nav>
<div class="row justify-content-center">
<div class="col col-lg-6">
<h3 class="text-secondary text-center mt-2 mb-5">LOGIN</h3>
<form>
<div class="mb-3">
<label for="email" class="form-label">Email address</label>
<input type="email" class="form-control" id="email" aria-describedby="emailHelp" bind:value={$user.email}>
</div>
<div class="mb-3">
<label for="password" class="form-label">Password</label>
<input type="text" class="form-control" id="password" bind:value={$user.password}>
</div>
<button type="submit" class="btn btn-primary" on:click|preventDefault={onLogin}>Login</button>
</form>
</div>
</div>
{#if loading}
<div class="text-center text-secondary">
<div class="spinner-border" style="width: 3rem; height: 3rem;" role="status">
<span class="visually-hidden">Loading...</span>
</div>
<p>Loading...</p>
</div>
{/if}
</section>
<script>
import { user } from '../lib/stores/store.js';
import { redirect } from '@sveltejs/kit';
import { goto } from '$app/navigation';
let loading = null
function onLogin(){
//loading = true
$user.email = 'mnizam@uitm.edu.my'
$user.access = true
goto('/crud'); //WORK
throw redirect(308, '/crud') //NOT WORK
}
</script>
STORE
src\lib\stores\store.js
import { writable } from 'svelte/store';
export const user = writable({
email: "mnizam30@gmail.com",
password: "4321",
access: false,
});
REGISTER PAGE
src\routes\register\+page.svelte
<section class="container">
<h2 class="text-center mt-5 mb-3 text-secondary">Registration</h2>
<nav class="text-center mb-5">
<a href="/"><i>Back</i></a>
</nav>
<div class="row justify-content-center">
<div class="col col-lg-6">
<form>
<div class="mb-3">
<label for="name" class="form-label">Name</label>
<input type="text" class="form-control" id="name" >
</div>
<div class="mb-3">
<label for="email" class="form-label">Email address</label>
<input type="email" class="form-control" id="email" aria-describedby="emailHelp">
</div>
<div class="mb-3">
<label for="password" class="form-label">Password</label>
<input type="password" class="form-control" id="password">
</div>
<button type="submit" class="btn btn-primary">Register</button>
</form>
</div>
</div>
</section>
CRUD PAGE
src\routes\crud\+page.svelte
<section class="container">
<h2 class="text-center mt-5 mb-3 text-secondary">CRUD MySQL Database</h2>
<nav class="text-center mb-5">
<a href="/"><i>Back</i></a>
</nav>
</section>
COMPLETED
CRUD (Read All Users)
src/routes/crud/+page.svelte
<section class="container">
<h2 class="text-center mt-5 mb-3 text-secondary">CRUD MySQL Database</h2>
<nav class="text-center mb-5">
<a href="/"><i>Back</i></a>
</nav>
<button type="submit" class="btn btn-primary mb-5" on:click|preventDefault={loadData}>Test: READ</button>
{#if error}
<p>Error: {error}</p>
{:else}
<ol>
{#each data as item}
<li>{item.name}</li>
{/each}
</ol>
{/if}
<!-- <pre>{JSON.stringify(data, null, 2)}</pre> -->
</section>
<script>
import axios from 'axios';
let data = [];
let error = null;
async function loadData() {
try {
const response = await axios.get('https://sveltekit.mlrguitm.com/getUsers');
const result = await response.data
data = result.data
} catch (err) {
error = err.message;
data = [];
}
}
</script>
MISC
CRUD (Read All Users)
src/routes/crud3/+page.server.js
import mysql from 'mysql2/promise';
// //CONNECT TO EXTERNAL DB (cPanel)
// const pool = mysql.createPool({
// host: process.env.DB_HOST,
// user: process.env.DB_USER,
// password: process.env.DB_PASSWORD,
// database: process.env.DB_NAME,
// });
// CONNECT TO LOCAL DB
const pool = mysql.createPool({
host: 'localhost',
user: 'root',
password: '',
database: 'sveltekit',
});
/** @type {import('@sveltejs/kit').PageServerLoad} */
export async function load() {
try {
const [rows] = await pool.query('SELECT * FROM users');
console.log('Fetched data:', rows); // Debugging line
return {
success: true,
data: rows
};
} catch (error) {
console.error('Error fetching data:', error);
return {
success: false,
data: []
};
}
}
CRUD (Read All Users)
src/routes/crud3/+page.svelte
<script>
export let data = { data: [] };
let users = data.data;
// console.log('Data received:', data); // Debugging line
</script>
<section class="container">
<h2 class="text-center mt-5 mb-3 text-danger">CRUD...</h2>
<p class="text-center">Connection In Svelte (+page.server.js)</p>
<nav class="text-center mb-5">
<a href="/"><i>Back</i></a><br>
</nav>
</section>
<section class="container">
<h5>Data In MySQL</h5>
<ol>
{#each users as user,idx (user.id)}
<li>{user.name} - {user.email} - {user.password}</li>
{/each}
</ol>
</section>
CRUD (Read All Users)
src\routes\api\getserver\+server.js
import mysql from 'mysql2/promise';
import { json } from "@sveltejs/kit";
// CONNECT TO LOCAL DB
const pool = mysql.createPool({
host: 'localhost',
user: 'root',
password: '',
database: 'sveltekit',
});
export async function GET() {
try {
const [rows] = await pool.query('SELECT * FROM users');
console.log('Fetched data:', rows); // Debugging line
return json({
success: true,
data: rows,
});
} catch (error) {
console.error('Error fetching data:', error);
return json({
success: false,
data: [],
});
}
}
CRUD (Read All Users)
src/routes/crud4/+page.svelte
<script>
import axios from 'axios';
let users = [];
let error = null;
async function fetchData() {
try {
const response = await axios.get('/api/getserver');
if (response.data.success) {
users = response.data.data;
} else {
error = 'Failed to fetch data';
}
} catch (err) {
error = 'Error fetching data: ' + err.message;
}
}
</script>
<section class="container">
<h2 class="text-center mt-5 mb-1 text-danger">CRUD 4 MySQL With Server.js</h2>
<p class="text-center text-danger">Server.js in routes/api/getserver/+server.js</p>
<p class="text-center">https://svelte.deepwebworks.com/blog/kit3</p>
<nav class="text-center mb-5">
<a href="/"><i>Back</i></a>
<a href="/crud4/addNew"><i>Add New</i></a>
</nav>
</section>
<section class="container">
<button class="mb-3" on:click={fetchData} >Fetch Users</button>
{#if error}
<p>{error}</p>
{:else}
<ol>
{#each users as user,idx (user.id)}
<li>{user.name} - {user.email} - {user.password}</li>
{/each}
</ol>
{/if}
</section>
CRUD (Add New User)
src\routes\api\getUser\+server.js
// CONNECT TO LOCAL DB
...
export async function POST({ request }) {
try {
const { name, email, password } = await request.json();
const [result] = await pool.query(
'INSERT INTO users (name, email, password) VALUES (?, ?, ?)',
[name, email, password]
);
console.log('Inserted data:', result); // Debugging line
return json({
success: true,
message: 'User added successfully',
});
} catch (error) {
console.error('Error inserting data:', error);
return json({
success: false,
message: 'Failed to add user',
});
}
}
CRUD (Add New User)
src\routes\crud4\addUser\+page.svelte
<script>
import axios from 'axios';
import { goto } from '$app/navigation';
let name = '';
let email = '';
let password = '';
async function addUser(event) {
event.preventDefault();
try {
const response = await axios.post('/api/getUser', {
name,
email,
password
});
if (response.data.success) {
alert('User added successfully');
goto('/crud4'); // Redirect to another page after successful addition
} else {
alert('Failed to add user');
}
} catch (error) {
console.error('Error adding user:', error);
alert('Failed to add user');
}
}
</script>
<section class="container">
<h2 class="text-center mt-5 mb-3 text-danger">Add New User</h2>
<nav class="text-center mb-5">
<a href="/crud4"><i>Back</i></a>
</nav>
</section>
<section class="container">
<div class="row justify-content-center">
<div class="col col-lg-6">
<form>
<div class="mb-3">
<label for="name" class="form-label">Name</label>
<input type="text" class="form-control" id="name" name="name" bind:value={name}>
</div>
<div class="mb-3">
<label for="email" class="form-label">Email</label>
<input type="email" class="form-control" id="email" name="email" bind:value={email}>
</div>
<div class="mb-3">
<label for="password" class="form-label">Password</label>
<input type="password" class="form-control" id="password" name="password" bind:value={password}>
</div>
<button type="submit" class="btn btn-primary" on:click={addUser}>Add User</button>
</form>
</div>
</div>
</section>
CRUD (DELETE User)
src\routes\api\getUser\+server.js
import mysql from 'mysql2/promise';
import { json } from "@sveltejs/kit";
// CONNECT TO LOCAL DB
export async function DELETE({ request }) {
try {
const { id } = await request.json();
const [result] = await pool.query(
'DELETE FROM users WHERE id = ?',
[id]
);
//console.log('Inserted data:', result); // Debugging line
return json({
success: true,
message: 'User deleted successfully',
});
} catch (error) {
//console.error('Error inserting data:', error);
return json({
success: false,
message: 'Failed to delete user 76',
});
}
}
CRUD (DELETE User)
src\routes\crud4\+page.svelte
<script>
import axios from 'axios';
let users = [];
let error = null;
.....
async function deleteUser(id){
try {
const response = await axios.delete('/api/getUser', {
data: { id }
});
if (response.data.success) {
alert('User deleted successfully');
fetchData(); //Refresh the user list
} else {
error = 'Failed to delete user';
}
} catch (err) {
error = 'Error fetching data: ' + err.message;
}
}
</script>
<section class="container">
<button class="mb-3" on:click={fetchData} >Fetch Users</button>
{#if error}
<p>{error}</p>
{:else}
<ol>
{#each users as user,idx (user.id)}
<li><a href="#top" on:click|preventDefault={()=>deleteUser(user.id)}><i>delete</i></a>
{user.name} - {user.email} - {user.password}
</li>
{/each}
</ol>
{/if}
</section>
METHOD 2 (+page.server.js)
READ User
src\routes\crud5\+page.svelte
<script>
export let data=[];
let {data:users, success, message} = data
</script>
<section class="container">
<h2 class="text-center mt-5 mb-3 text-primary">CRUD 5</h2>
<nav class="text-center mb-5">
<a href="/"><i>Back</i></a>
</nav>
</section>
<section class="container">
{#if !success}
<div class="text-danger text-center">
<h1>Status: 500</h1>
<p>{message}</p>
</div>
{:else}
<h4 class="mb-3"> Method 2: +page.server.js</h4>
<ol>
{#each users as user, idx (user.id)}
<li>
{user.name} - {user.email} - {user.password}
</li>
{/each}
</ol>
{/if}
<br/><br/><br/>
</section>
READ User
src\routes\crud5\+page.server.js
import mysql from 'mysql2/promise';
// CONNECT TO LOCAL DB
const pool = mysql.createPool({
host: 'localhost',
user: 'root',
password: '',
database: 'db1',
});
export async function load() {
try {
const [rows] = await pool.execute('SELECT * FROM users');
//console.log('Fetched data:', rows); // Debug
return {
success: true,
data: rows,
message: ""
};
} catch (error) {
//console.error('Error fetching data:', error);
return {
success: false,
data: [],
message: 'Failed to fetch data from the database.'
};
}
}
DELETE User
src\routes\crud5\+page.svelte
<script>
import { goto } from '$app/navigation';
import { user_delete, user_edit } from '$lib/stores/store.js';
...
function handleDelete(user){
user_delete.set(user)
goto('/crud5/deleteUser')
}
</script>
<section class="container">
<h3 class="mb-3 text-black">Method 2: +page.server.js</h3>
{#if error}
<p>{error}</p>
{:else}
<ol>
{#each users as user,idx (user.id)}
<li>
<button type="button" class="btn btn-link py-0 px-0 pb-1" on:click={handleDelete(user)}><i>delete</i></button>
<span class="my-0">{user.name} - {user.email} - {user.password}</span>
</li>
{/each}
</ol>
{/if}
</section>
DELETE User
src\routes\crud5\+page.svelte
<script>
import { onMount } from 'svelte';
import { user_delete } from '$lib/stores/store.js';
import Notification from '$lib/components/Notification.svelte';
let status;
let message;
onMount(() => {
const form = document.querySelector('form');
form.addEventListener('submit', async (event) => {
event.preventDefault();
const formData = new FormData(form);
const response = await fetch(form.action, {
method: 'POST',
body: formData
});
const result = await response.json();
//console.log('Response status:', response.status); // Log the response status
//console.log('Response result:', result); // Log the response result
// Parse the data property to get the actual status and message
const parsedData = JSON.parse(result.data);
status = parsedData[1];
message = parsedData[3];
});
});
</script>
<section class="container">
<h2 class="text-center mt-5 mb-3 text-danger">CRUD 5 MySQL</h2>
<h4 class="text-center mt-5 mb-3 text-danger">Delete User</h4>
<nav class="text-center mb-5">
<a href="/crud5"><i>Back</i></a>
</nav>
</section>
<section class="container">
<div class="row justify-content-center mb-5">
<div class="col col-lg-6">
<form method="POST" action="?/deleteUser">
<div class="mb-3">
<input type="text" class="form-control" id="id" name="id" bind:value={$user_delete.id}>
</div>
<div class="mb-3">
<input type="text" class="form-control" id="name" name="name" bind:value={$user_delete.name}>
</div>
<div class="mb-3">
<input type="email" class="form-control" id="email" name="email" bind:value={$user_delete.email}>
</div>
<div class="mb-3">
<input type="text" class="form-control" id="password" name="password" bind:value={$user_delete.password}>
</div>
<button type="submit" class="btn btn-danger">Delete</button>
</form>
</div>
</div>
</section>
<Notification {status} {message} successRedirect="/crud5" errorRedirect="/crud5"/>
DELETE User
src\routes\crud5\+page.server.js
import mysql from 'mysql2/promise';
const pool = mysql.createPool({
host: 'localhost',
user: 'root',
password: '',
database: 'sveltekit',
});
export const actions = {
deleteUser: async ({ request }) => {
const formData = await request.formData();
const id = formData.get('id');
try {
const [result] = await pool.execute('DELETE FROM users WHERE id = ?', [id]);
if (result.affectedRows > 0) {
return {
status: 200,
body: { message: 'User deleted successfully' }
};
} else {
return {
status: 404,
body: { message: 'User not found' }
};
}
} catch (error) {
return {
status: 500,
body: { message: 'An error occurred while deleting the user', error }
};
}
}
};
DELETE User
src\lib\components\Notification.svelte
<script>
import Swal from 'sweetalert2';
import { goto } from '$app/navigation';
export let status;
export let message;
export let successRedirect = '/crud5';
export let errorRedirect = '/crud5';
const showNotification = () => {
Swal.fire({
title: status === 200 ? 'Success' : 'Error',
text: status === 200 ? 'Operation completed successfully!' : message || 'An error occurred',
icon: status === 200 ? 'success' : 'error',
confirmButtonText: 'Close'
}).then(() => {
goto(status === 200 ? successRedirect : errorRedirect);
});
};
$: if (status !== undefined) {
showNotification();
}
</script>
DELETE User
src\lib\stores\store.js
import { writable } from 'svelte/store';
...
export const user_delete = writable({ id:'', name:'', email:'', password:''});
EDIT User
EDIT User
EDIT User
src\routes\crud5\+page.svelte
<script>
import { goto } from '$app/navigation';
import { user_delete, user_edit } from '$lib/stores/store.js';
...
function handleEdit(user){
user_edit.set(user)
goto('/crud5/editUser')
}
</script>
<section class="container">
<h3 class="mb-3 text-black">Method 2: +page.server.js</h3>
{#if error}
<p>{error}</p>
{:else}
<ol>
{#each users as user,idx (user.id)}
<li>
<button type="button" class="btn btn-link py-0 px-0 pb-1" on:click={handleEdit(user)}><i>edit</i></button>
<span class="my-0">{user.name} - {user.email} - {user.password}</span>
</li>
{/each}
</ol>
{/if}
</section>
EDIT User
src\routes\crud5\+page.svelte
<script>
import { onMount } from 'svelte';
import { user_edit } from '$lib/stores/store.js';
import Notification from '$lib/components/Notification.svelte';
let status;
let message;
onMount(() => {
const form = document.querySelector('form');
form.addEventListener('submit', async (event) => {
event.preventDefault();
const formData = new FormData(form);
const response = await fetch(form.action, {
method: 'POST',
body: formData
});
const result = await response.json();
//console.log('Response status:', response.status); // Log the response status
//console.log('Response result:', result); // Log the response result
// Parse the data property to get the actual status and message
const parsedData = JSON.parse(result.data);
status = parsedData[1];
message = parsedData[3];
});
});
</script>
<section class="container">
<h2 class="text-center mt-5 mb-3 text-secondary">CRUD 5 MySQL</h2>
<h4 class="text-center mt-5 mb-3 text-secondary">Edit User</h4>
<nav class="text-center mb-5">
<a href="/crud5"><i>Back</i></a>
</nav>
</section>
<section class="container">
<div class="row justify-content-center mb-5">
<div class="col col-lg-6">
<form method="POST" action="?/editUser">
<div class="mb-3">
<label for="id" class="form-label">Id</label>
<input type="text" class="form-control" id="id" name="id" bind:value={$user_edit.id}>
</div>
<div class="mb-3">
<label for="name" class="form-label">Name</label>
<input type="text" class="form-control" id="name" name="name" bind:value={$user_edit.name}>
</div>
<div class="mb-3">
<label for="email" class="form-label">Email</label>
<input type="email" class="form-control" id="email" name="email" bind:value={$user_edit.email}>
</div>
<div class="mb-3">
<label for="password" class="form-label">Password</label>
<input type="text" class="form-control" id="password" name="password" bind:value={$user_edit.password}>
</div>
<button type="submit" class="btn btn-secondary">Edit</button>
</form>
</div>
</div>
</section>
<Notification {status} {message} successRedirect="/crud5" errorRedirect="/crud5"/>
EDIT User
src\routes\crud5\+page.server.js
import mysql from 'mysql2/promise';
const pool = mysql.createPool({
host: 'localhost',
user: 'root',
password: '',
database: 'sveltekit',
});
export const actions = {
editUser: async ({ request }) => {
const formData = await request.formData();
const id = formData.get('id');
const name = formData.get('name');
const email = formData.get('email');
const password = formData.get('password');
try {
const [result] = await pool.query(
'UPDATE users SET name = ?, email = ?, password = ? WHERE id = ?',
[name, email, password, id]
);
if (result.affectedRows > 0) {
return {
status: 200,
body: { message: 'User edited successfully' }
}
} else {
return {
status: 404,
body: { message: 'User not found or no changes made' }
}
}
} catch (error) {
return {
status: 500,
body: { message: 'Failed to update user', error }
};
}
},
};
EDIT User
src\lib\components\Notification.svelte
<script>
import Swal from 'sweetalert2';
import { goto } from '$app/navigation';
export let status;
export let message;
export let successRedirect = '/crud5';
export let errorRedirect = '/crud5';
const showNotification = () => {
Swal.fire({
title: status === 200 ? 'Success' : 'Error',
text: status === 200 ? 'Operation completed successfully!' : message || 'An error occurred',
icon: status === 200 ? 'success' : 'error',
confirmButtonText: 'Close'
}).then(() => {
goto(status === 200 ? successRedirect : errorRedirect);
});
};
$: if (status !== undefined) {
showNotification();
}
</script>
EDIT User
src\lib\stores\store.js
import { writable } from 'svelte/store';
...
export const user_edit = writable({ id:'', name:'', email:'', password:''});
Page updated
Report abuse