13## Authentication
14
15Login to your SQLite Explorer with [password authentication](https://www.val.town/v/pomdtr/password_auth) with your [Val Town API Token](https://www.val.town/settings/api) as the password.
16
17## Todos / Plans
27 <head>
28 <title>SQLite Explorer</title>
29 <link rel="preconnect" href="https://fonts.googleapis.com" />
30
31 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
32 <link
33 href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@300..700&family=Source+Sans+3:ital,wght@0,200..900;1,200..900&display=swap"
34 rel="stylesheet"
35 />
3date: 2023-12-10
4author: Alex Johnson
5summary: Exploring emerging trends and technologies shaping the future of blogging
6---
7
14
15// Get list of blog posts
16app.get("/api/posts", async (c) => {
17 try {
18 const posts = await listBlogPosts();
25
26// Get a specific blog post
27app.get("/api/posts/:slug", async (c) => {
28 const slug = c.req.param("slug");
29 try {
25
262. **Backend**: A Hono app serves the blog:
27 - Lists all blog posts via API
28 - Retrieves individual posts
29 - Serves the frontend HTML
592. Parse the frontmatter metadata
603. Convert markdown to HTML
614. Serve the content via API endpoints
62
63## Step 4: Create the Frontend
2import { useAuth } from "./useAuth.tsx";
3
4const PROJECT_ENDPOINT = "/api/project";
5const FILES_ENDPOINT = "/api/project-files";
6
7export function useProject (projectId: string, branchId?: string) {
2import { useAuth } from "./useAuth.tsx";
3
4const ENDPOINT = "/api/projects-loader";
5
6export function useProjects () {
3import { useAuth } from "./useAuth.tsx";
4
5const ENDPOINT = "/api/create-project";
6
7export function useCreateProject () {
2import { useAuth } from "./useAuth.tsx";
3
4const ENDPOINT = "/api/create-branch";
5
6export function useCreateBranch (projectId: string) {
