├── .github └── ISSUE_TEMPLATE │ ├── bug.yaml │ ├── documentation.yaml │ └── feature.yaml ├── LICENSE ├── README.md ├── example-auth ├── .gitignore ├── LICENSE ├── README.md ├── package-lock.json ├── package.json ├── public │ ├── favicon.png │ ├── global.css │ └── index.html ├── rollup.config.js ├── scripts │ └── setupTypeScript.js └── src │ ├── App.svelte │ └── main.js └── server-side-rendering ├── .env.example ├── .gitignore ├── .npmrc ├── .prettierignore ├── .prettierrc ├── LICENSE ├── README.md ├── package-lock.json ├── package.json ├── src ├── app.d.ts ├── app.html ├── hooks.server.ts ├── lib │ ├── images │ │ ├── appwrite-logo-dark.svg │ │ └── login-dark-mode.png │ └── server │ │ └── appwrite.ts └── routes │ ├── +layout.server.ts │ ├── +layout.svelte │ ├── +page.server.ts │ ├── account │ ├── +page.server.ts │ └── +page.svelte │ ├── oauth │ └── +server.ts │ ├── signin │ ├── +page.server.ts │ └── +page.svelte │ └── signup │ ├── +page.server.ts │ └── +page.svelte ├── static └── appwrite-icon.svg ├── svelte.config.js ├── tsconfig.json └── vite.config.ts /.github/ISSUE_TEMPLATE/bug.yaml: -------------------------------------------------------------------------------- 1 | name: "🐛 Bug Report" 2 | description: "Submit a bug report to help us improve" 3 | title: "🐛 Bug Report: " 4 | labels: [bug] 5 | body: 6 | - type: markdown 7 | attributes: 8 | value: | 9 | Thanks for taking the time to fill out our bug report form 🙏 10 | - type: textarea 11 | id: steps-to-reproduce 12 | validations: 13 | required: true 14 | attributes: 15 | label: "👟 Reproduction steps" 16 | description: "How do you trigger this bug? Please walk us through it step by step." 17 | placeholder: "When I ..." 18 | - type: textarea 19 | id: expected-behavior 20 | validations: 21 | required: true 22 | attributes: 23 | label: "👍 Expected behavior" 24 | description: "What did you think would happen?" 25 | placeholder: "It should ..." 26 | - type: textarea 27 | id: actual-behavior 28 | validations: 29 | required: true 30 | attributes: 31 | label: "👎 Actual Behavior" 32 | description: "What did actually happen? Add screenshots, if applicable." 33 | placeholder: "It actually ..." 34 | - type: dropdown 35 | id: appwrite-version 36 | attributes: 37 | label: "🎲 Appwrite version" 38 | description: "What version of Appwrite are you running?" 39 | options: 40 | - Version 0.10.x 41 | - Version 0.9.x 42 | - Version 0.8.x 43 | - Version 0.7.x 44 | - Version 0.6.x 45 | - Different version (specify in environment) 46 | validations: 47 | required: true 48 | - type: dropdown 49 | id: operating-system 50 | attributes: 51 | label: "💻 Operating system" 52 | description: "What OS is your server / device running on?" 53 | options: 54 | - Linux 55 | - MacOS 56 | - Windows 57 | - Something else 58 | validations: 59 | required: true 60 | - type: textarea 61 | id: environment 62 | validations: 63 | required: false 64 | attributes: 65 | label: "🧱 Your Environment" 66 | description: "Is your environment customized in any way?" 67 | placeholder: "I use Cloudflare for ..." 68 | - type: checkboxes 69 | id: no-duplicate-issues 70 | attributes: 71 | label: "👀 Have you spent some time to check if this issue has been raised before?" 72 | description: "Have you Googled for a similar issue or checked our older issues for a similar bug?" 73 | options: 74 | - label: "I checked and didn't find similar issue" 75 | required: true 76 | - type: checkboxes 77 | id: read-code-of-conduct 78 | attributes: 79 | label: "🏢 Have you read the Code of Conduct?" 80 | options: 81 | - label: "I have read the [Code of Conduct](https://github.com/appwrite/appwrite/blob/HEAD/CODE_OF_CONDUCT.md)" 82 | required: true 83 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/documentation.yaml: -------------------------------------------------------------------------------- 1 | name: "📚 Documentation" 2 | description: "Report an issue related to documentation" 3 | title: "📚 Documentation: " 4 | labels: [documentation] 5 | body: 6 | - type: markdown 7 | attributes: 8 | value: | 9 | Thanks for taking the time to make our documentation better 🙏 10 | - type: textarea 11 | id: issue-description 12 | validations: 13 | required: true 14 | attributes: 15 | label: "💭 Description" 16 | description: "A clear and concise description of what the issue is." 17 | placeholder: "Documentation should not ..." 18 | - type: checkboxes 19 | id: no-duplicate-issues 20 | attributes: 21 | label: "👀 Have you spent some time to check if this issue has been raised before?" 22 | description: "Have you Googled for a similar issue or checked our older issues for a similar bug?" 23 | options: 24 | - label: "I checked and didn't find similar issue" 25 | required: true 26 | - type: checkboxes 27 | id: read-code-of-conduct 28 | attributes: 29 | label: "🏢 Have you read the Code of Conduct?" 30 | options: 31 | - label: "I have read the [Code of Conduct](https://github.com/appwrite/appwrite/blob/HEAD/CODE_OF_CONDUCT.md)" 32 | required: true -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/feature.yaml: -------------------------------------------------------------------------------- 1 | name: 🚀 Feature 2 | description: "Submit a proposal for a new feature" 3 | title: "🚀 Feature: " 4 | labels: [feature] 5 | body: 6 | - type: markdown 7 | attributes: 8 | value: | 9 | Thanks for taking the time to fill out our feature request form 🙏 10 | - type: textarea 11 | id: feature-description 12 | validations: 13 | required: true 14 | attributes: 15 | label: "🔖 Feature description" 16 | description: "A clear and concise description of what the feature is." 17 | placeholder: "You should add ..." 18 | - type: textarea 19 | id: pitch 20 | validations: 21 | required: true 22 | attributes: 23 | label: "🎤 Pitch" 24 | description: "Please explain why this feature should be implemented and how it would be used. Add examples, if applicable." 25 | placeholder: "In my use-case, ..." 26 | - type: checkboxes 27 | id: no-duplicate-issues 28 | attributes: 29 | label: "👀 Have you spent some time to check if this issue has been raised before?" 30 | description: "Have you Googled for a similar issue or checked our older issues for a similar bug?" 31 | options: 32 | - label: "I checked and didn't find similar issue" 33 | required: true 34 | - type: checkboxes 35 | id: read-code-of-conduct 36 | attributes: 37 | label: "🏢 Have you read the Code of Conduct?" 38 | options: 39 | - label: "I have read the [Code of Conduct](https://github.com/appwrite/appwrite/blob/HEAD/CODE_OF_CONDUCT.md)" 40 | required: true -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2020 Appwrite 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Appwrite + Svelte = ❤️ 2 | This repository has various example projects created by the Appwrite community using Svelte. 3 | 4 | ## Small Examples 5 | - [**Login and Signup Page**](/example-auth/) Implementation of Appwrite's Create Session and Create User API Using Svelte as the UI Framework. 6 | 7 | 8 | ## Large Projects 9 | None yet! Go ahead and create some! -------------------------------------------------------------------------------- /example-auth/.gitignore: -------------------------------------------------------------------------------- 1 | /node_modules/ 2 | /public/build/ 3 | 4 | .DS_Store 5 | -------------------------------------------------------------------------------- /example-auth/LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2020 Bradley Schofield 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /example-auth/README.md: -------------------------------------------------------------------------------- 1 | # Appwrite + Svelte = ❤️ 2 | 3 | This example is to showcase [Appwrite's JS API](https://github.com/appwrite/sdk-for-js) with [Svelte](https://svelte.dev/) by creating a simple login/register page. 4 | 5 | ## Prerequisites 6 | 7 | - A Recent Version of NodeJS 8 | - NPM (Feel free to use Yarn if you want to, just switch out the NPM Commands for their Yarn counterparts) 9 | - [A locally running appwrite instance](https://appwrite.io/docs/installation). 10 | 11 | ## Getting Started 12 | To get started quickly we will use degit to create the foundation for our project. 13 | ```bash 14 | npx degit sveltejs/template appwrite-svelte 15 | cd appwrite-svelte 16 | npm install 17 | ``` 18 | This will create a Svelte project in the `appwrite-svelte` folder relative to where the commands was run aswell as install any dependencies. 19 | 20 | While we are in the CLI we will install the Appwrite JS API by running: 21 | ````bash 22 | npm install appwrite 23 | ```` 24 | and finally, we will launch the svelte development server with: 25 | ```bash 26 | npm run dev 27 | ``` 28 | This should launch a server on `localhost:5000` with Live Reload 29 | 30 | ## Introducing the Appwrite SDK 31 | With this boilerplate we can now initialise the Appwrite SDK in the project before working on the login page. Doing this is simple go ahead and open up `src/main.js`and underneath `import App from './App.svelte';` add: 32 | ```js 33 | import 'appwrite'; 34 | const appwrite = new window.Appwrite(); // Used for compatibility with a 112 | ``` 113 | 114 | So, let's explain this script. First we grab the appwrite prop from the parent by using `export let appwrite` without this we won't be able to run API Calls, We then setup some variables to store various data we will use later. Including the username, passsword and a few other variables. 115 | 116 | The login function which will be called on form submit will do the following: 117 | 118 | 1. Check that a previous request is not being processed using the loading variable, if it is then another request isn't started. 119 | 2. Sets error to false, this is used later to tell the user if something is wrong for example the appwrite server could not be reached or the username or password was incorrect. 120 | 3. Then the request is started, this is a promise so we use .then to process the result and .catch if something goes wrong. 121 | 4. If everything is successful then we stop the loading and get the userdata. 122 | 5. If an error occours we handle it and show a error to the user. 123 | 124 | We also use onMount() to check if the user is already logged in on page load. 125 | 126 | ## Creating the Login Page design 127 | With the logic in place we can now start working on the login pages design including the form, add the following code below the ` 14 | 15 | 16 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /example-auth/rollup.config.js: -------------------------------------------------------------------------------- 1 | import svelte from 'rollup-plugin-svelte'; 2 | import resolve from '@rollup/plugin-node-resolve'; 3 | import commonjs from '@rollup/plugin-commonjs'; 4 | import livereload from 'rollup-plugin-livereload'; 5 | import { terser } from 'rollup-plugin-terser'; 6 | 7 | const production = !process.env.ROLLUP_WATCH; 8 | 9 | function serve() { 10 | let server; 11 | 12 | function toExit() { 13 | if (server) server.kill(0); 14 | } 15 | 16 | return { 17 | writeBundle() { 18 | if (server) return; 19 | server = require('child_process').spawn('npm', ['run', 'start', '--', '--dev'], { 20 | stdio: ['ignore', 'inherit', 'inherit'], 21 | shell: true 22 | }); 23 | 24 | process.on('SIGTERM', toExit); 25 | process.on('exit', toExit); 26 | } 27 | }; 28 | } 29 | 30 | export default { 31 | input: 'src/main.js', 32 | output: { 33 | sourcemap: true, 34 | format: 'iife', 35 | name: 'app', 36 | file: 'public/build/bundle.js' 37 | }, 38 | plugins: [ 39 | svelte({ 40 | // enable run-time checks when not in production 41 | dev: !production, 42 | // we'll extract any component CSS out into 43 | // a separate file - better for performance 44 | css: css => { 45 | css.write('bundle.css'); 46 | } 47 | }), 48 | 49 | // If you have external dependencies installed from 50 | // npm, you'll most likely need these plugins. In 51 | // some cases you'll need additional configuration - 52 | // consult the documentation for details: 53 | // https://github.com/rollup/plugins/tree/master/packages/commonjs 54 | resolve({ 55 | browser: true, 56 | dedupe: ['svelte'] 57 | }), 58 | commonjs(), 59 | 60 | // In dev mode, call `npm run start` once 61 | // the bundle has been generated 62 | !production && serve(), 63 | 64 | // Watch the `public` directory and refresh the 65 | // browser on changes when not in production 66 | !production && livereload('public'), 67 | 68 | // If we're building for production (npm run build 69 | // instead of npm run dev), minify 70 | production && terser() 71 | ], 72 | watch: { 73 | clearScreen: false 74 | } 75 | }; 76 | -------------------------------------------------------------------------------- /example-auth/scripts/setupTypeScript.js: -------------------------------------------------------------------------------- 1 | // @ts-check 2 | 3 | /** This script modifies the project to support TS code in .svelte files like: 4 | 5 | 8 | 9 | As well as validating the code for CI. 10 | */ 11 | 12 | /** To work on this script: 13 | rm -rf test-template template && git clone sveltejs/template test-template && node scripts/setupTypeScript.js test-template 14 | */ 15 | 16 | const fs = require("fs") 17 | const path = require("path") 18 | const { argv } = require("process") 19 | 20 | const projectRoot = argv[2] || path.join(__dirname, "..") 21 | 22 | // Add deps to pkg.json 23 | const packageJSON = JSON.parse(fs.readFileSync(path.join(projectRoot, "package.json"), "utf8")) 24 | packageJSON.devDependencies = Object.assign(packageJSON.devDependencies, { 25 | "svelte-check": "^1.0.0", 26 | "svelte-preprocess": "^4.0.0", 27 | "@rollup/plugin-typescript": "^4.0.0", 28 | "typescript": "^3.9.3", 29 | "tslib": "^2.0.0", 30 | "@tsconfig/svelte": "^1.0.0" 31 | }) 32 | 33 | // Add script for checking 34 | packageJSON.scripts = Object.assign(packageJSON.scripts, { 35 | "validate": "svelte-check" 36 | }) 37 | 38 | // Write the package JSON 39 | fs.writeFileSync(path.join(projectRoot, "package.json"), JSON.stringify(packageJSON, null, " ")) 40 | 41 | // mv src/main.js to main.ts - note, we need to edit rollup.config.js for this too 42 | const beforeMainJSPath = path.join(projectRoot, "src", "main.js") 43 | const afterMainTSPath = path.join(projectRoot, "src", "main.ts") 44 | fs.renameSync(beforeMainJSPath, afterMainTSPath) 45 | 46 | // Switch the app.svelte file to use TS 47 | const appSveltePath = path.join(projectRoot, "src", "App.svelte") 48 | let appFile = fs.readFileSync(appSveltePath, "utf8") 49 | appFile = appFile.replace(" 83 | 84 |
85 |
86 | {#if !userprofile} 87 | {#if (!page)} 88 |
89 |

Login

90 | {#if error} 91 |

{error}

92 | {/if} 93 |
94 | 95 | 96 | 97 |
98 |
99 | {:else} 100 |
101 |

Register

102 | {#if error} 103 |

{error}

104 | {/if} 105 |
106 | 107 | 108 | 109 | 110 | 111 |
112 |
113 | {/if} 114 |

115 | {page ? 'Got an account?' : "Haven't got an account?"} 116 |
117 | page = !page}>{page ? 'Login' : 'Sign Up'} 118 |

119 | {:else} 120 |
121 |

Logged In!

122 |

{userprofile.name}

123 |

{userprofile.email}

124 |

ID: {userprofile.$id}

125 | 126 |
127 | {/if} 128 |
129 |
130 | 131 | 132 | 174 | -------------------------------------------------------------------------------- /example-auth/src/main.js: -------------------------------------------------------------------------------- 1 | import App from './App.svelte' 2 | import 'appwrite' 3 | 4 | var appwrite = new window.Appwrite() // Used for compatability with a 7 | 8 | Server side rendering with Appwrite 9 | 10 |
11 |
12 |
13 |

Server side rendering_

14 |
15 |
16 | 21 |
22 |
23 |
24 | 25 |
26 |
27 |
28 | 29 | 88 | -------------------------------------------------------------------------------- /server-side-rendering/src/routes/+page.server.ts: -------------------------------------------------------------------------------- 1 | import { redirect } from '@sveltejs/kit'; 2 | 3 | export async function load({ locals }) { 4 | if (!locals.user) { 5 | throw redirect(301, '/signin'); 6 | } 7 | 8 | throw redirect(301, '/account'); 9 | } 10 | -------------------------------------------------------------------------------- /server-side-rendering/src/routes/account/+page.server.ts: -------------------------------------------------------------------------------- 1 | import { SESSION_COOKIE, createSessionClient } from '$lib/server/appwrite.js'; 2 | import { redirect } from '@sveltejs/kit'; 3 | 4 | export async function load({ locals }) { 5 | if (!locals.user) throw redirect(301, '/signin'); 6 | 7 | return { 8 | user: locals.user 9 | }; 10 | } 11 | 12 | export const actions = { 13 | default: async (event) => { 14 | const { account } = createSessionClient(event); 15 | 16 | await account.deleteSession('current'); 17 | event.cookies.delete(SESSION_COOKIE); 18 | 19 | throw redirect(301, '/signin'); 20 | } 21 | }; 22 | -------------------------------------------------------------------------------- /server-side-rendering/src/routes/account/+page.svelte: -------------------------------------------------------------------------------- 1 | 12 | 13 |
14 |

Your account

15 |
16 |
17 | 34 |
35 |
36 |
    37 |
  • 38 | 39 |
    • 40 |
41 |
42 |
43 |
44 | -------------------------------------------------------------------------------- /server-side-rendering/src/routes/oauth/+server.ts: -------------------------------------------------------------------------------- 1 | import { SESSION_COOKIE, createAdminClient } from '$lib/server/appwrite.js'; 2 | import { error } from '@sveltejs/kit'; 3 | 4 | export async function POST(event) { 5 | const { account } = createAdminClient(); 6 | 7 | const redirectUrl = await account.createOAuth2Token( 8 | 'github', 9 | `${event.url.origin}/oauth`, 10 | `${event.url.origin}/signin` 11 | ); 12 | 13 | return Response.redirect(redirectUrl, 302); 14 | } 15 | 16 | export async function GET(event) { 17 | const userId = event.url.searchParams.get('userId'); 18 | const secret = event.url.searchParams.get('secret'); 19 | 20 | if (!userId || !secret) { 21 | throw error(500, 'OAuth failed - no userId or secret passed'); 22 | } 23 | 24 | const { account } = createAdminClient(); 25 | const session = await account.createSession(userId, secret); 26 | 27 | if (!session || !session.secret) { 28 | throw error(500, 'Create session from token failed - no session or secret'); 29 | } 30 | 31 | const headers = new Headers({ 32 | location: '/account' 33 | }); 34 | 35 | headers.set( 36 | 'set-cookie', 37 | event.cookies.serialize(SESSION_COOKIE, session.secret, { 38 | sameSite: 'strict', 39 | expires: new Date(session.expire), 40 | secure: true, 41 | path: '/' 42 | }) 43 | ); 44 | 45 | return new Response(null, { status: 302, headers }); 46 | } 47 | -------------------------------------------------------------------------------- /server-side-rendering/src/routes/signin/+page.server.ts: -------------------------------------------------------------------------------- 1 | import { SESSION_COOKIE, createAdminClient } from '$lib/server/appwrite.js'; 2 | import { redirect } from '@sveltejs/kit'; 3 | 4 | export function load({ locals }) { 5 | if (locals.user) throw redirect(301, '/account'); 6 | } 7 | 8 | export const actions = { 9 | default: async (event) => { 10 | const { account } = createAdminClient(); 11 | 12 | const form = await event.request.formData(); 13 | 14 | const email = form.get('email') as string; 15 | const password = form.get('password') as string; 16 | 17 | const session = await account.createEmailPasswordSession(email, password); 18 | 19 | event.cookies.set(SESSION_COOKIE, session.secret, { 20 | sameSite: 'strict', 21 | expires: new Date(session.expire), 22 | secure: true, 23 | path: '/' 24 | }); 25 | 26 | throw redirect(301, '/'); 27 | } 28 | }; 29 | -------------------------------------------------------------------------------- /server-side-rendering/src/routes/signin/+page.svelte: -------------------------------------------------------------------------------- 1 |
2 |

Demo sign in

3 |
4 |
5 |
    6 |
  • 7 |

    8 | This is a demo project for Appwrite server side 9 | rendering. View the source code on the 10 | GitHub repository. 15 |

    16 |
    • 17 |
  • 18 | 19 |
    20 | 28 |
    29 |
    • 30 |
  • 31 | 32 |
    33 | 42 | 45 |
    46 |
    • 47 |
  • 48 | 49 |
    • 50 | or 51 |
  • 52 |
53 |
54 |
55 | 59 |
60 |
61 | 66 |
67 | 68 | 88 | -------------------------------------------------------------------------------- /server-side-rendering/src/routes/signup/+page.server.ts: -------------------------------------------------------------------------------- 1 | import { SESSION_COOKIE, createAdminClient } from '$lib/server/appwrite.js'; 2 | import { redirect } from '@sveltejs/kit'; 3 | import { ID } from 'node-appwrite'; 4 | 5 | export function load({ locals }) { 6 | if (locals.user) throw redirect(301, '/'); 7 | } 8 | 9 | export const actions = { 10 | default: async (event) => { 11 | const { account } = createAdminClient(); 12 | 13 | const form = await event.request.formData(); 14 | 15 | const name = form.get('name') as string; 16 | const email = form.get('email') as string; 17 | const password = form.get('password') as string; 18 | 19 | await account.create(ID.unique(), email, password, name); 20 | const session = await account.createEmailPasswordSession(email, password); 21 | 22 | event.cookies.set(SESSION_COOKIE, session.secret, { 23 | sameSite: 'strict', 24 | expires: new Date(session.expire), 25 | secure: true, 26 | path: '/' 27 | }); 28 | 29 | throw redirect(301, '/'); 30 | } 31 | }; 32 | -------------------------------------------------------------------------------- /server-side-rendering/src/routes/signup/+page.svelte: -------------------------------------------------------------------------------- 1 |
2 |

Demo sign up

3 |
4 |
5 |
    6 |
  • 7 |

    8 | This is a demo project for Appwrite server side 9 | rendering. View the source code on the 10 | GitHub repository. 15 |

    16 |
    • 17 |
  • 18 | 19 |
    20 | 28 |
    29 |
    • 30 |
  • 31 | 32 |
    33 | 41 |
    42 |
    • 43 |
  • 44 | 45 |
    46 | 55 | 58 |
    59 |
    • 60 |
  • 61 | 62 |
    • 63 | or 64 |
  • 65 |
66 |
67 | 68 |
69 | 73 |
74 |
75 | 80 |
81 | 82 | 102 | -------------------------------------------------------------------------------- /server-side-rendering/static/appwrite-icon.svg: -------------------------------------------------------------------------------- 1 | 2 | 5 | 8 | -------------------------------------------------------------------------------- /server-side-rendering/svelte.config.js: -------------------------------------------------------------------------------- 1 | import adapter from '@sveltejs/adapter-auto'; 2 | import { vitePreprocess } from '@sveltejs/kit/vite'; 3 | 4 | /** @type {import('@sveltejs/kit').Config} */ 5 | const config = { 6 | // Consult https://kit.svelte.dev/docs/integrations#preprocessors 7 | // for more information about preprocessors 8 | preprocess: vitePreprocess(), 9 | 10 | kit: { 11 | // adapter-auto only supports some environments, see https://kit.svelte.dev/docs/adapter-auto for a list. 12 | // If your environment is not supported or you settled on a specific environment, switch out the adapter. 13 | // See https://kit.svelte.dev/docs/adapters for more information about adapters. 14 | adapter: adapter() 15 | } 16 | }; 17 | 18 | export default config; 19 | -------------------------------------------------------------------------------- /server-side-rendering/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./.svelte-kit/tsconfig.json", 3 | "compilerOptions": { 4 | "allowJs": true, 5 | "checkJs": true, 6 | "esModuleInterop": true, 7 | "forceConsistentCasingInFileNames": true, 8 | "resolveJsonModule": true, 9 | "skipLibCheck": true, 10 | "sourceMap": true, 11 | "strict": true 12 | } 13 | // Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias 14 | // 15 | // If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes 16 | // from the referenced tsconfig.json - TypeScript does not merge them in 17 | } 18 | -------------------------------------------------------------------------------- /server-side-rendering/vite.config.ts: -------------------------------------------------------------------------------- 1 | import { sveltekit } from '@sveltejs/kit/vite'; 2 | import { defineConfig } from 'vite'; 3 | 4 | export default defineConfig({ 5 | plugins: [sveltekit()] 6 | }); 7 | --------------------------------------------------------------------------------