feat: init

routes/recipes/[name].tsx

@@ -0,0 +1,26 @@
+import { Handlers, PageProps } from "$fresh/server.ts";
+import { IngredientsList } from "../../components/IngredientsList.tsx";
+import { RecipeHero } from "../../components/RecipeHero.tsx";
+import { MainLayout } from "../../components/layouts/main.tsx";
+import { Recipe } from "../../lib/recipes.ts";
+import { getRecipe } from "../api/recipes/[name].ts";
+
+export const handler: Handlers<Recipe | null> = {
+  async GET(_, ctx) {
+    const recipe = await getRecipe(ctx.params.name);
+    return ctx.render(recipe);
+  },
+};
+
+export default function Greet(props: PageProps<Recipe>) {
+  return (
+    <MainLayout>
+      <RecipeHero recipe={props.data} />
+      <div class="px-12 text-white mt-10">
+        <h3 class="text-3xl">Ingredients</h3>
+        <IngredientsList ingredients={props.data.ingredients} />
+        <h3 class="text-3xl">Preperation</h3>
+      </div>
+    </MainLayout>
+  );
+}

routes/recipes/index.tsx

@@ -0,0 +1,25 @@
+import { Handlers, PageProps } from "$fresh/server.ts";
+import { RecipeCard } from "../../components/RecipeCard.tsx";
+import { MainLayout } from "../../components/layouts/main.tsx";
+import type { Document } from "../../lib/documents.ts";
+import { Recipe } from "../../lib/recipes.ts";
+import { getRecipes } from "../api/recipes/index.ts";
+
+export const handler: Handlers<Recipe[] | null> = {
+  async GET(_, ctx) {
+    const recipes = await getRecipes();
+    return ctx.render(recipes);
+  },
+};
+
+export default function Greet(props: PageProps<Recipe[] | null>) {
+  return (
+    <MainLayout>
+      <div class="flex flex-wrap justify-center items-center gap-4 px-4">
+        {props.data?.map((doc) => {
+          return <RecipeCard recipe={doc} />;
+        })}
+      </div>
+    </MainLayout>
+  );
+}