Angle Berry Client

This project consists of two repositories:

• Angle Berry Client (Current)
• Angle Berry Server

Technology stack

Client

• TypeScript
• Svelte
• SvelteKit
• TailwindCSS

Server

• PocketBase

Dependencies

Angle Berry Client

• @sveltejs/adapter-vercel
• @sveltejs/kit
• @sveltejs/vite-plugin-svelte
• @typescript-eslint/eslint-plugin
• @typescript-eslint/parser
• autoprefixer
• cssnano
• eslint
• eslint-config-prettier
• eslint-plugin-svelte
• phosphor-icons-svelte
• pocketbase
• pocketbase-typegen
• postcss
• postcss-load-config
• prettier
• prettier-plugin-svelte
• prettier-plugin-tailwindcss
• svelte
• svelte-check
• svelte-copy
• svelte-french-toast
• svelte-loading-bar
• svelte-outclick
• sveltekit-superforms
• tailwindcss
• tailwindcss-addons
• tslib
• typescript
• vite
• zod

Angle Berry Server

• PocketBase

Hosting

• Angle Berry Client is hosted on Vercel.
• Angle Berry Server is hosted on Hop.

Development

• Install NodeJS (v20.10.0 stable).
• Install PNPM (v8.14.0 stable).
• Install Git (v2.40.1.windows.1 stable).
• Install vsCode - Optional.

Clone the repositories

• Run git clone --depth 1 https://github.com/babakfp/angle-berry-client.git.
• Run git clone --depth 1 https://github.com/babakfp/angle-berry-server.git.

Setup

Open the projects in two separate vsCode instances, and:

1. In the angle-berry-server directory, open a terminal and run the following command to start the server: pnpm serve.
2. Once the server is running, copy the domain address displayed in the terminal. For example, it might be http://127.0.0.1:8090.
3. In the angle-berry-server directory, duplicate the .env.example file located in the root of your project and rename the duplicate file to .env.
4. Update the value for PUBLIC_POCKETBASE_URL in the .env file with the copied domain address.
5. Run pnpm i and pnpm dev.
6. Done 🎉.

angle-berry-client auth credentials

There are two users that you can switch between by the user menu:

• User
• • Username: user
• • Password: useruser
• Admin
• • Username: admin
• • Password: adminadmin

angle-berry-server admin credentials

Use this to log in to the PocketBase dashboard:

• Email: [email protected]
• Password: [email protected]

Commands

• dev: Run SvelteKit project.
• build: Build SvelteKit project.
• preview: Preview the build of SvelteKit project.
• prepare: Nothing important (you don't need to run this).
• check: Check for issues in the code.
• check:watch: Check for issues in the code.
• lint: Check for issues in the code.
• format: Format and make the code look good.
• typegen: Generate PocketBase schema types.

Todo

• BUG: When sending a new message in the chat and immediately attempting to edit it, the message content is not automatically written in the input box. This issue seems to be related to the "bind" keyword. However, it is important to note that this functionality works fine for old messages.