{"id":13522588,"url":"https://github.com/pro7tech/sveltekit-blog-app","last_synced_at":"2025-03-31T22:31:53.609Z","repository":{"id":217017721,"uuid":"610760471","full_name":"pro7tech/sveltekit-blog-app","owner":"pro7tech","description":"🚀 SvelteKit Blog App is a free and open-source simple fullstack blog app built with SvelteKit, Tailwind CSS, and EdgeDB","archived":false,"fork":false,"pushed_at":"2023-11-28T06:26:52.000Z","size":763,"stargazers_count":76,"open_issues_count":2,"forks_count":7,"subscribers_count":2,"default_branch":"main","last_synced_at":"2024-11-02T06:34:14.609Z","etag":null,"topics":["blog","database","edgedb","fullstack-javascript","html","javascript","mit-license","open-source","svelte","sveltekit","tailwind","tailwind-css","tailwindcss"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","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/pro7tech.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-03-07T12:33:14.000Z","updated_at":"2024-11-01T10:46:16.000Z","dependencies_parsed_at":null,"dependency_job_id":"b22d7961-96db-4305-8ed8-b52c0bf04dec","html_url":"https://github.com/pro7tech/sveltekit-blog-app","commit_stats":null,"previous_names":["pro7tech/sveltekit-blog-app"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pro7tech%2Fsveltekit-blog-app","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pro7tech%2Fsveltekit-blog-app/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pro7tech%2Fsveltekit-blog-app/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pro7tech%2Fsveltekit-blog-app/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/pro7tech","download_url":"https://codeload.github.com/pro7tech/sveltekit-blog-app/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246552797,"owners_count":20795829,"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":["blog","database","edgedb","fullstack-javascript","html","javascript","mit-license","open-source","svelte","sveltekit","tailwind","tailwind-css","tailwindcss"],"created_at":"2024-08-01T06:00:49.495Z","updated_at":"2025-03-31T22:31:53.603Z","avatar_url":"https://github.com/pro7tech.png","language":"JavaScript","funding_links":[],"categories":["Applications"],"sub_categories":[],"readme":"![SvelteKitBlogApp](https://user-images.githubusercontent.com/29139306/223408199-decaa65b-6213-462b-891f-2996d7f7590c.png)\n\n## About\n\nThe Real-World App (https://github.com/gothinkster/realworld) named the “mother of all demo apps” provides a fullstack Medium.com blog clone with a variety of frontend and backend stacks to demo the features needed for a robust web application.\n\nThis app demos the same features of “querying \u0026 persisting data to a database, an authentication system, session management, full CRUD for resources” while simplifying the app to an integrated stack of:\n\n- **SvelteKit:** A top framework for developer retention in the 2021 and 2022 State of JS Survey ([Source](https://2022.stateofjs.com/en-US/libraries/rendering-frameworks/))\n- **Tailwind:** Consistently the most popular CSS Framework in the annual State of CSS Survey ([Source](https://2022.stateofcss.com/en-US/css-frameworks/))\n- **EdgeDB:** Open Source Database with 10 Years of Development providing the best of both worlds between SQL and an ORM ([Source](https://www.edgedb.com/blog/a-solution-to-the-sql-vs-orm-dilemma))\n\n## Features\n- **Simplicity:** Minimizes 3rd party dependencies in favor of using the platform to keep things simple\n- **Modern Tailwind Design:** Uses the latest best practices for a beautiful design\n- **Desktop and Mobile-friendly:** Looks great on both large-screen and small-screen (mobile) devices.\n- **Authentication and Authorization:** Built-in users management with role based authorization \n- **100% Performance Score** on Google Lighthouse\n- **Modern Admin Panel:** Elegant admin dashboard demoing CRUD operations for Posts, Comments, Tags, and Users\n\n## Screenshots\n\n### Frontend Pages\nA blog overview page, blog page with comments, sign-in, sign-up and error pages.\n![frontend](https://user-images.githubusercontent.com/29139306/223408688-22e9d832-6d05-4272-9d4f-b3a46ab61b08.png)\n\n### User Profile Screens\nPages for users to update their profile and password.\n![profile](https://user-images.githubusercontent.com/29139306/223408403-f49b4e52-09aa-4c5a-b7fd-35e2a24cde96.png)\n\n### Admin Pages\nOnly users with role of ‘admin’ can access these pages.  CRUD pages for users, posts, comments, tags.  \n![admin](https://user-images.githubusercontent.com/29139306/223407889-93cab579-ebe9-48e7-9283-413a808a5f2a.png)\n\n### Mobile Friendly\n![mobile](https://user-images.githubusercontent.com/29139306/223408426-a0a08c4c-854b-478b-8c9f-685bdbdc0866.png)\n\n### EdgeDb UI \n\nRun command 'edgedb ui' in root folder to see the database explorer and query REPL\n![Screenshot 2023-03-15 at 9 54 05 PM](https://user-images.githubusercontent.com/29139306/225521291-ab5f18b8-ea6f-4686-b27d-f6f0dace7b99.png)\n![Screenshot 2023-03-15 at 9 54 45 PM](https://user-images.githubusercontent.com/29139306/225521308-a3671129-64a6-4551-8220-1c375bddbf45.png)\n\n\n### Performance\n100% Performance on Google Lighthouse\n![Screenshot 2023-03-15 at 4 26 31 PM](https://user-images.githubusercontent.com/29139306/225521173-0e4c09fb-61b4-4928-a0ae-1840642b78fe.png)\n\n### Code Show Feature\nUse Keyboard shortcut for your platform (Command ⌘ + Shift ⇧ on Mac) to activate a hover component that shows the code generating the UI under the mouse cursor\n![Screenshot 2023-03-15 at 10 05 34 PM](https://user-images.githubusercontent.com/29139306/225521088-694050c9-f6ce-4e37-8950-b41d4cce9e25.png)\n![ezgif-1-c611e45007](https://user-images.githubusercontent.com/29139306/226241441-e2534ddf-6da6-414d-a2cc-ff8d6ba2d441.gif)\n\n## Installation:\n\nEdgeDb is a prerequisite: https://www.edgedb.com/install\n\n1. Clone the repository and install dependencies:\n\n```\ngit clone https://github.com/pro7tech/sveltekit-blog-app.git\ncd sveltekit-blog-app\nnpm install\n```\n\n2. Initialize files for connecting to database\n\n```\nedgedb project init\nnpx @edgedb/generate edgeql-js\n```\n\n3. Run the dev server\n\n```\nnpm run dev\n```\n\nThen navigate to the root directory of the app to automatically seed the database: http://localhost:5173/ \n\nYou can then login to the admin pages with:\n* email: admin@example.com\n* password: password\n\n## Deploying to Production with Digital Ocean and Vercel\n\n1. Use the Digital Ocean on click deploy tutorial to setup your database: https://www.edgedb.com/docs/guides/deployment/digitalocean#one-click-deploy\n2. Copy your Database Connection String (DSN) from step 1.  It has the format edgedb://username:password@hostname:port\n3. Run the migration file against your remote database\n\n```\n$ edgedb migrate --dsn edgedb://username:password@hostname:port --tls-security insecure\n```\n\n4. Deploy this app to Vercel with the link below.\n\nhttps://vercel.com/new/git/external?repository-url=https://github.com/pro7tech/sveltekit-blog-app\u0026repository-name=sveltekit-blog-app\u0026env=EDGEDB_DSN,EDGEDB_CLIENT_TLS_SECURITY\n\nWhen Prompted:\n* Set EDGEDB_DSN to your database’s DSN\n* Set EDGEDB_CLIENT_TLS_SECURITY to insecure. This will disable EdgeDB’s default TLS checks.\n\n## License\n\nMIT Licensed\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpro7tech%2Fsveltekit-blog-app","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpro7tech%2Fsveltekit-blog-app","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpro7tech%2Fsveltekit-blog-app/lists"}