{"id":22213929,"url":"https://github.com/xmlking/spectacular","last_synced_at":"2025-07-06T06:42:19.254Z","repository":{"id":191233570,"uuid":"675379612","full_name":"xmlking/spectacular","owner":"xmlking","description":"Sweet \u0026 Powerful SvelteKit Project Template  https://spectacular-console.vercel.app/  https://spectacular-docs.vercel.app/ https://spectacular-web.vercel.app/  ","archived":false,"fork":false,"pushed_at":"2024-11-26T21:43:31.000Z","size":22060,"stargazers_count":47,"open_issues_count":11,"forks_count":4,"subscribers_count":4,"default_branch":"main","last_synced_at":"2024-11-26T22:29:25.896Z","etag":null,"topics":["biomejs","bun","flowbite","graphql","hasura","houdini","mswjs","nhost","playwright","pnpm","postgresql","skeletonui","superforms","svelte","sveltekit","tailwindcss","turborepo","vercel","vite","vitest"],"latest_commit_sha":null,"homepage":"https://xmlking.github.io/spectacular/","language":"Svelte","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/xmlking.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":".github/CODEOWNERS","security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"github":["xmlking"],"open_collective":"xmlking"}},"created_at":"2023-08-06T18:07:57.000Z","updated_at":"2024-11-26T21:43:35.000Z","dependencies_parsed_at":"2024-06-20T13:27:28.862Z","dependency_job_id":"dc7c7553-ed97-4b6e-8066-77b4002964e2","html_url":"https://github.com/xmlking/spectacular","commit_stats":null,"previous_names":["xmlking/spectacular"],"tags_count":14,"template":true,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xmlking%2Fspectacular","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xmlking%2Fspectacular/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xmlking%2Fspectacular/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xmlking%2Fspectacular/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/xmlking","download_url":"https://codeload.github.com/xmlking/spectacular/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":227802821,"owners_count":17822113,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["biomejs","bun","flowbite","graphql","hasura","houdini","mswjs","nhost","playwright","pnpm","postgresql","skeletonui","superforms","svelte","sveltekit","tailwindcss","turborepo","vercel","vite","vitest"],"created_at":"2024-12-02T21:12:38.498Z","updated_at":"2025-07-06T06:42:19.247Z","avatar_url":"https://github.com/xmlking.png","language":"Svelte","readme":"# Spectacular\n\n**Spectacular** is a full-stack [Turborepo](https://turbo.build/repo/docs/handbook) template project with _SvelteKit_ meta-framework all working in harmony and sharing packages.\n\n## Tech Stack\n\n- Monorepo: [Turborepo](https://turbo.build/repo/docs/handbook)\n- JS Framework: [SvelteKit](https://kit.svelte.dev/)\n- CSS: [Tailwind CSS](https://tailwindcss.com/)\n- UI Components: tailwindcss based [SkeletonUI](https://www.skeleton.dev/), [Shadcn](https://www.shadcn-svelte.com/) and [Flowbite](https://flowbite-svelte.com/)\n- Unit/Component testing: [vitest](https://vitest.dev/)\n  - [Sveltest](https://sveltest.dev/) , [Repo](https://github.com/spences10/sveltest), [Migrating](https://scottspence.com/posts/migrating-from-testing-library-svelte-to-vitest-browser-svelte)\n  - [Testing Library](https://testing-library.com/)\n  - [Svelte Testing Library](https://github.com/testing-library/svelte-testing-library)\n- API Mocking: [Mock Service Worker](https://mswjs.io/)\n- Code Coverage [c8](https://c8.io/)\n- End-to-End Testing: [playwright](https://playwright.dev/)\n- GraphQL: [Houdini](https://www.houdinigraphql.com/) \u0026 [Hasura](https://hasura.io/)\n- Authentication: [Auth.js](https://authjs.dev/),  [nhost-auth](https://nhost.io/product/auth)\n- PWA: [Vite PWA](https://vite-pwa-org.netlify.app/frameworks/sveltekit.html)\n- Linter/Formatter: [Biome](https://biomejs.dev/) and [Ultracite](https://github.com/haydenbleasel/ultracite) linting configuration.\n\n## Features\n\n- [x] Responsive Design: [Container queries](https://www.smashingmagazine.com/2021/05/complete-guide-css-container-queries/)\n- [ ] **Progressive Web Apps (PWAs):**\n  - [x] Smart caching with Service Works\n  - [ ] Re-engage customers with Push Notifications\n  - [x] Push Application Updates\n  - [ ] Offline app with [pglite](https://github.com/electric-sql/pglite)\n- [ ] Fonts and Image Optimization: edge caching, Lazy-loading images\n- [x] **SEO Ready**\n  - [x] **Meta Tags** and **Json-LD** with [svelte-meta-tags](https://github.com/oekazuma/svelte-meta-tags#readme)\n  - [ ] Dynamic **OpenGraph** images with [sveltekit-og](https://github.com/etherCorps/sveltekit-og#create-svelte)\n  - [x] Image Optimization with [sveltejs/enhanced-img](https://kit.svelte.dev/docs/images)\n- [x] **GraphQL:** [Houdini](https://www.houdinigraphql.com/) the disappearing GraphQL client for SvelteKit. and [nHost](https://nhost.io/) as BaaS\n  - [ ] [Elevated Permissions](https://nhost.io/blog/elevated-permissions)\n- [x] **Forms:** Form handling with [[superforms](https://superforms.vercel.app/), [source](https://github.com/ciscoheat/sveltekit-superforms)] and Validation with `zod`\n- [ ] **Error Handling:**\n  - [x] Strongly Typed Error Handling with [generic errors](./src/lib/errors#readme)\n  - [x] _FormData_ preprocessing with [zodfd](./src/lib/zodfd#readme)\n- [x] **Themes:** tailwindcss **DarkMode** switcher\n- [x] **Deployment:** Docker build and deployment serverless / k8s runtimes.\n- [x] **Tables:** [svelte-headless-table](https://svelte-headless-table.bryanmylee.com/docs/getting-started/overview#what-is-a-headless-ui-library)\n- [ ] **Security:** Use [Auth.js](https://authjs.dev/) when [stable](https://vercel.com/blog/announcing-sveltekit-auth)\n- [ ] [Vitebook](https://vitebook.dev/introduction/what-is-vitebook.html) or [Storybook 7](https://github.com/storybookjs/storybook/blob/next/code/frameworks/sveltekit/README.md)\n- [ ] [GraphQL Yoga API](https://github.com/dotansimha/graphql-yoga/blob/main/examples/sveltekit/src/routes/api/graphql/%2Bserver.ts)\n- [ ] Documentation micro site with [Astro](https://github.com/PuruVJ/neodrag/tree/main/docs)\n- [ ] Build Tools\n  - [ ] Use [Bob.Build](https://bob.build/) for Smart Builds, Build Cache etc and Bob's [github-actions](https://bob.build/docs/ci-recipes/github-actions/)\n  - [ ] Use [earthly.dev](https://earthly.dev/) - Great for monorepos, Compatible with Every Language, Framework, and Build Tool\n- [x] Use [sveltekit-og](https://github.com/etherCorps/sveltekit-og) for Open Graph Image Generation\n- [x] **Internationalization(i18n)** with [inlang](https://inlang.com/c/libraries) `Paraglide JS Adapter SvelteKit`\n- [ ] **User Notifications**: - multi-tenant, communication preferences. [Design](https://www.linkedin.com/pulse/design-notification-system-omar-ismail/)\n\n## Experementing\n\n- [ ] Implement Changesets [(link)](https://github.com/changesets/changesets) with [turborepo](https://turbo.build/repo/docs/handbook/publishing-packages/versioning-and-publishing)\n- [ ] **TAURI:** Use [Tauri](https://tauri.app/) with [Skeleton](https://www.skeleton.dev/docs/tauri) for multi-platform.\n- [x] Charts with [Unovis](https://unovis.dev/). Explore [Gallery](https://unovis.dev/gallery)\n- [x] [Feature Flags](https://flags-sdk.dev/) with [Vercel Feature Flags](https://vercel.com/docs/workflow-collaboration/feature-flags) and [Vercel Toolbar](https://vercel.com/docs/workflow-collaboration/vercel-toolbar)\n\n## Setup\n\n```shell\ncd ~/Developer/Work/SPA\ngit clone https://github.com/xmlking/spectacular.git\ncd spectacular \u0026\u0026 pnpm i\n# (optional) playwright is required for end-to-end testing\nbunx playwright install\n# (optional) add git-commit-hooks\ncog install-hook --all\n```\n\n### Environment Variables\n\nBy default, the `dev` server (dev command) runs in `development` mode and the `build` command run in `production`\nmode.  \nThis means when running `turbo build`, it will load the env variables from `.env.production` if there is one:  \nUse `.env.local` to override environment variables in `.env` (secrets like API keys) for local development.\n\n## Developing\n\nOnce you've cloned the project and installed dependencies with `pnpm i`, start a development server:\n\n### Start local Hasura\n\n```sh\n# stat all services in background and show logs\nmake up # for first time use `make boot` then `make up`\n# this will start all services with default profile + services with `all` profile.\nmake up PROFILES=all\n# verify status/health of services\nmake ps\n# shotdown all services\nmake down\n# DANGER: run this if you want to reset database and other persistent volumes\nmake teardown\n# verify if docker `compose` getting correctly resolved application config from .env and .secrests files\nmake check\nmake check PROFILES=all,optional\n# ssch to a container to debug\n#make exec-\u003ctarget\u003e\nmake exec-hasura\nmake exec-auth\n```\n\n### Start apps/console\n\n```shell\nturbo run console#dev\n\n# or use `--log-order=stream` to disable TUI\nturbo --filter=console --log-order=stream dev\n\n# or start the server and open the app in a new browser tab\nturbo run console#dev  -- --open \n\n# run in debug mode\nturbo run console#dev:debug\n\n# run with a custom inline config\n# inline environment variables has higher precedence than ones loaded from .env and .env.local files\nPUBLIC_NHOST_GRAPHQL_URL=api.mycompany.com:443 turbo dev\n```\n\n## Maintenance\n\n### Update\n\nTo update the packages to their latest versions in `package.json`\n\n```shell\npnpm up --latest -r\npnpm audit --fix\n```\n\n### Format\n\n```shell\n# format all packages\nturbo run format\n# format root\nturbo run format:root\n```\n\n### Lint\n\n```shell\n# lint all packages\nturbo run lint\n# lint root\nturbo run lint:root\n```\n\n## Testing\n\n### Unit/Component Tests\n\n```shell\nturbo test\n\nturbo test:ui\n#Then, you can visit the Vitest UI at http://localhost:51204/__vitest__/.\n\n# test coverage\nturbo test:coverage\n\n# updating Snapshots\npnpx vitest -u\n\n# test specific folder\npnpx vitest apps/web/src/lib/utils\n(or)\n./node_modules/.bin/vitest run apps/web/src/lib/utils\n```\n\n### E2E Tests\n\n```shell\nturbo test:e2e\n```\n\n## Building\n\nTo create a production version of your app:\n\n```shell\nturbo build\n# run build\nturbo run console#dev:build\nturbo --filter=console... build\nturbo --filter=console... --dry build\nturbo --filter=console... --graph build\n```\n\nRun from the local build directory:\n\n```shell\nNODE_ENV=production \\\nPUBLIC_NHOST_GRAPHQL_URL=api.mycompany.com:443 \\\nnode build\n\n# (optional) pass ORIGIN when using `adapter-node` build\nHOST=127.0.0.1 \\\nPORT=4000 \\\nORIGIN=https://my.site \\\nnode build\n```\n\nYou can preview the production build with `turbo run console#preview`.\n\n\u003e To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target\n\u003e environment.\n\n## Release\n\nafter checking-in all your changes, bump the VERSION and build the docker image.\n\n```shell\n# dry-run\ncog bump --auto --dry-run\n# this will bump version in package.json and create git tag and commit.\ncog bump --auto\n```\n\n## Libs\n\nTo build and publish libs\n\n```shell\nturbo build --filter=lib...\ncd package\npnpm publish\n```\n","funding_links":["https://github.com/sponsors/xmlking","https://opencollective.com/xmlking"],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxmlking%2Fspectacular","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fxmlking%2Fspectacular","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxmlking%2Fspectacular/lists"}