JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 44
  • Score
    100M100P100Q50405F
  • License MIT

Create Appwrite apps with your server-side rendering

Package Exports

  • appwrite-ssr
  • appwrite-ssr/src/index.ts

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (appwrite-ssr) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

appwrite-ssr

appwrite-ssr will help you to create ssr applications with appwrite.

🛠️ Installation Steps:

download appwrite-ssr

npm i appwrite-ssr
  or
yarn add appwrite-ssr

import appwrite-ssr

import appwrite from 'appwrite-ssr'

set up project id, project endpoint and hostname (you can also set apiKey if you want to use admin actions - it is optional)

import appwrite from 'appwrite-ssr'

appwrite.setProject({ endPoint: 'https://cloud.appwrite.io/v1', projectId: 'fjalůj', hostname: 'localhost', apiKey: 'key...' })

how to authorizate user?

// authorizate by passing users session
const { Collection } = appwrite.setSession('users session here')
//authorizate by passing users cookies
const { Collection } = appwriteSSR.setCookie([{ name: '', value: '' }])
//dont authorizate user - use this for signing user into app
const { Collection } = appwriteSSR.none()
//act as admin (use your apiKey)
const { Collection } = appwrite.setAdmin()

log user into your application using email (example with SvelteKit)

export const load: PageServerLoad = async (event) => {
    const { account } = appwrite.none()
    const { sessionLegacyToken, sessionToken } = await account.loginViaEmail('email', 'password')
    event.cookies.set(sessionToken.name, sessionToken.value)
}

log user into your application using oAuth2 (example with SvelteKit)

on client side use this:
await user.createOAuth2Session(platform, `${location.origin}/auth/oauth2/success`, `${location.origin}/oauth2/failure`)
on server side use this:
//the path for this function has to be /auth/oauth2/success (strictly)
export const load: PageServerLoad = async (event) => {
    const { account } = appwrite.none()
    const { sessionLegacyToken, sessionToken } = await account.oauth2Login(event.url)
    event.cookies.set(sessionToken.name, sessionToken.value)
}

log user out or your application (example with SvelteKit)

//the path for this function has to be /auth/oauth2/success (strictly)
export const load: PageServerLoad = async (event) => {
    const { account } = appwrite.none()
    const { sessionLegacyToken, sessionToken } = await account.logOut()
    event.cookies.delete(sessionToken.name)
}

create your own lib for all (here is my example with Sveltekit)

import type { Types } from 'appwrite-ssr'
import appwriteSSR, { Query } from 'appwrite-ssr'

export type DocumentSkeleton = {
    $id: string
    $collectionId: string
    $databaseId: string
    $createdAt: string
    $updatedAt: string
    $permissions: string[]
}

export type Document<T extends Partial<DocumentSkeleton> & object> = {
    [Key in keyof T]: T[Key] extends Record<string, unknown> ? Document<T[Key]> : T[Key]
} & DocumentSkeleton

type GrassDocumentGet = Document<{
    grassName: string
    grassOptionalDescription: string //optional value with default value
    grassEnumValue: null | 'value' | 'value2'
}>
type GrassDocumentCreate = {
    grassName: string
    grassOptionalDescription?: string
    grassEnumValue: null | 'value' | 'value2'
}

// key2 is optional but there is always a default value

export const appwrite = appwriteSSR.setProject({
    projectId: process.env.APPWRITE_PROJECT_ID,
    hostname: 'localhost',
    endpoint: process.env.APPWRITE_ENDPOINT,
    apiKey: process.env.APPWRITE_API_KEY,
})

export const setCookie = (cookies: Types.Cookie[]) => {
    const app = appwrite.setCookie(cookies)
    const collectionGrass = new app.Collection<GrassDocumentGet, GrassDocumentCreate>('test', 'grass')
    const grassBucket = new app.Bucket('grassBucket')

    return { collections: { collectionGrass }, ...app, buckets: { grassBucket } }
}

export const setAdmin = () => {
    const app = appwrite.setAdmin()
    const collectionGrass = new app.Collection<GrassDocumentGet, GrassDocumentCreate>('test', 'grass')
    return { collections: { collectionGrass }, ...app }
}

export const grassQuery = Query<GrassDocumentGet>()

export const queries = {
    grassQuery,
}

initialize collections

  import type {
    UserInfoDocument,
    UserInfoDocumentCreate,
  } from '@app/ts-types'

    import appwrite from '@app/appwrite-ssr'

    const { Collection } = appwrite.setSession(session)

    const userInfo =new Collection<UserInfoDocument, UserInfoDocumentCreate>('account', 'userInfo'),
    userInfo.createDocument({}, [userId])

example code with Sveltekit (collections)

import type { PageServerLoad } from './$types'
import type { Types } from 'appwrite-ssr'
import appwrite, { Query } from 'appwrite-ssr'

export type DocumentSkeleton = {
    $id: string
    $collectionId: string
    $databaseId: string
    $createdAt: string
    $updatedAt: string
    $permissions: string[]
}

export type Document<T extends Partial<DocumentSkeleton> & object> = {
    [Key in keyof T]: T[Key] extends Record<string, unknown> ? Document<T[Key]> : T[Key]
} & DocumentSkeleton

type GrassDocumentGet = Document<{
    grassName: string
    grassOptionalDescription: string //optional value with default value
    grassEnumValue: null | 'value' | 'value2'
}>
type GrassDocumentCreate = {
    grassName: string
    grassOptionalDescription?: string
    grassEnumValue: null | 'value' | 'value2'
}

// key2 is optional but there is always a default value

const setCookie = (cookies: Types.Cookie[]) => {
    const { Collection } = appwrite
        .setProject({
            endPoint: 'https://cloud.appwrite.io/v1',
            projectId: 'fa',
        })
        .setCookie(cookies)

    const collectionGrass = new Collection<GrassDocumentGet, GrassDocumentCreate>('experiences', 'userInfo')
    return { collectionGrass }
}

const grassQuery = Query<GrassDocumentGet>()

export const load: PageServerLoad = async (event) => {
    const cookies: Types.Cookie[] = event.cookies.getAll()
    const collections = setCookie(cookies)
    const result = await collections.collectionGrass.getDocument([grassQuery.equal('grassName', 'jj')])
    return { result }
}

example code with Sveltekit (buckets)

import appwrite, { permissions, type Types } from 'appwrite-ssr'
import type { PageServerLoad } from './$types'

const setCookie = (cookies: Types.Cookie[]) => {
    const { Bucket } = appwrite
        .setProject({
            endPoint: 'https://cloud.appwrite.io/v1',
            projectId: 'fads',
        })
        .setCookie(cookies)

    const bucketGrass = new Bucket('myBucketId')

    return { bucketGrass }
}

export const load: PageServerLoad = async (event) => {
    const buckets = setCookie(event.cookies.getAll())
    const base64 = ''
    const res = buckets.bucketGrass.createFile(base64, permissions.owner('myUserId'))
    return res
}

used packages/technologies:

appwrite

🛡️ License:

This project is licensed under the MIT

💖 Any questions?

otaprokopec@gmail.com