gold-web-app-sveltekit Svelte Themes

Gold Web App Sveltekit

Gold Daily / Emas Terkini

This is simple application to show the latest Gold price. It is bootstrapped with create-svelte.

Tech Stack

Features to be implemented

As a User View

  • User can see the latest gold price
  • User can see history gold price
  • User can filter history gold price
  • User can see variant gold price today
  • User can get daily notification for updated gold price
  • User can input gold they have
  • User can see list gold they have with the total
  • Users can see the profit of gold they have

    As a Development View

  • Implement Dark and Light Theme script location: src\lib\components\nav\theme.svelte
  • Use svelte/store to handle state script location: src\lib\stores\main-info.ts
  • Use drizzle-orm to handle ORM script location: src\lib\db\\* and scr\lib\services\\*
  • Use planet-scale to save data
  • Use layer-cake to showing the Price History Chart script location: src\lib\components\chart\\*
  • Create daily scraping to get the daily gold price with script location: src\routes\api\generate\\+server.ts
  • Use cheerio for scraping script location: src\routes\api\generate\scrap*.ts
  • Use cron-job to run scraping script daily
  • Impement Two Language, Bahasa and English
  • Impement push notification
  • Use ????? to handle and maintain push notification
  • Implement PWA
  • Using ????? methodology to handle cache (PWA)
  • Get over 90 in Lighthouse Performance web and mobile
  • Get over 90 in Lighthouse Accessibility web and mobile
  • Get over 90 in Lighthouse Best Practice web and mobile
  • Get over 90 in Lighthouse SEO web and mobile
  • Impement and Create Unit Test
  • Use ????? to unit test

Running Locally

  1. Clone the repository
git clone https://github.com/sadmann7/skateshop.git
  1. Install dependencies using pnpm
pnpm install
  1. Copy the .env.example to .env and update the variables.
cp .env.example .env
  1. Start the development server
pnpm run dev
  1. Push the database schema
pnpm run db:push
  1. Setup VS Code for svelte development
  • Install latest VS Code
  • Install Plugin: Svelte : extensions for svelte
  • Install Plugin: Svelte for VS Code

Generate History Gold Price

  1. Setup for geting gold price in dollar a. Access https://data-asg.goldprice.org/GetDataHistorical/USD-XAU/0 b. Copy the result and paste to key data in file src/routes/api/generate-history/data-gold-en.json
  2. Setup for getting gold price in rupiah a. Access https://www.logammulia.com/id/harga-emas-hari-ini b. Then in Network dev-tools, choose https://www.logammulia.com/data-base-price/gold/sell?_token=[TOKEN]. c. Copy the result and paste to key data in file C:\xampp2\htdocs\emasku\app\src\routes\api\generate-history\data-antam.json
  3. Run the project and access localhost:4000/api/generate-history

How do I deploy this?

Follow the deployment guides for Vercel

Top categories

Loading Svelte Themes