diff --git a/lesson-04/remix-site/.gitignore b/lesson-04/remix-site/.gitignore index 3f7bf98d..a825da4e 100644 --- a/lesson-04/remix-site/.gitignore +++ b/lesson-04/remix-site/.gitignore @@ -4,3 +4,4 @@ node_modules /build /public/build .env +/app/tailwind.css diff --git a/lesson-04/remix-site/app/db/db.json b/lesson-04/remix-site/app/db/db.json index 33b7bbba..f203094c 100644 --- a/lesson-04/remix-site/app/db/db.json +++ b/lesson-04/remix-site/app/db/db.json @@ -1,19 +1,91 @@ { - "posts": [ + "recipes": [ { "id": "1", - "title": "Post 1", - "body": "This is test post #1" + "title": "Spaghetti", + "body": "This is test post #1", + "seperatedIngredients": [ + "apples", + " cinamon", + " dough" + ], + "author": "Kasia", + "img": "https://ocdn.eu/pulscms-transforms/1/iGxk9kpTURBXy8wYTQ2YmY1M2NlYTVlMTM2NWU2MjdiMmRjODExZTUxZi5qcGeTlQMAH80D6M0CMpMJpjA2NTMzYgaTBc0EsM0CdoGhMAE/spaghetti-puttanesca.jpg" }, { "id": "2", - "title": "Post 2", - "body": "This is test post #2" + "title": "Muffins", + "body": "This is test post #2", + "seperatedIngredients": [ + "flour", + " eggs", + " milk", + "chocolate" + ], + "author": "Kasia", + "img": "https://www.valdemarsro.dk/wp-content/2021/01/vaniljemuffins.jpg" }, { "id": "3", - "title": "Post 3", - "body": "This is test post #3" + "title": "Tomato Soup", + "body": "This soup is everything I want tomato soup to be! It’s rich and creamy, yet doesn’t weigh me down. It’s bursting with amazing tomato flavor, yet it’s made from canned tomatoes.", + "seperatedIngredients": [ + "tomatos", + " peper", + " salt", + "onion", + "olive oil" + ], + "author": "Kasia", + "img": "https://images.unsplash.com/photo-1547592166-23ac45744acd?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1171&q=80" + }, + { + "id": "17f259f2ef0", + "title": "Lasagne", + "body": "This is lasagne", + "seperatedIngredients": [ + "tomatos", + " lasagne pasta", + " meat" + ], + "author": "Magda", + "img": "https://images.unsplash.com/photo-1614961909013-1e2212a2ca87?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1887&q=80" + }, + { + "id": "17f25a5e53a", + "title": "Apple pie", + "body": "Apple pie", + "seperatedIngredients": [ + "apples", + " cinamon", + " dough" + ], + "author": "Magda", + "img": "https://images.unsplash.com/photo-1587248720327-8eb72564be1e?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1887&q=80" + }, + { + "id": "17f25e97ee3", + "title": "Curry Ramen", + "body": "Curry", + "seperatedIngredients": [ + "ramen pasta", + " curry", + " coconut milk" + ], + "author": "Magda", + "img": "https://www.kwestiasmaku.com/sites/v123.kwestiasmaku.com/files/curry_ramen_01.jpg" + }, + { + "id": "17f2653bdd0", + "title": "Sandwich", + "body": "This is a sandwich hihihihiihihi", + "seperatedIngredients": [ + "bread", + " lettuce", + " cheese" + ], + "author": "Kasia", + "img": "https://assets.epicurious.com/photos/5d3770225c5cb8000935d1db/6:4/w_3272,h_2181,c_limit/crispy-green-goddess-sandwich-recipe-BA-071119.jpg" } ] -} +} \ No newline at end of file diff --git a/lesson-04/remix-site/app/db/db.server.js b/lesson-04/remix-site/app/db/db.server.js index 5c592eb3..8175aef2 100644 --- a/lesson-04/remix-site/app/db/db.server.js +++ b/lesson-04/remix-site/app/db/db.server.js @@ -6,5 +6,5 @@ const adapter = new JSONFileSync(file); const db = new LowSync(adapter); db.read(); -db.data = db.data || { posts: [] }; +db.data = db.data || { recipes: [] }; export default db; diff --git a/lesson-04/remix-site/app/root.jsx b/lesson-04/remix-site/app/root.jsx index bb49e187..47b5b47b 100644 --- a/lesson-04/remix-site/app/root.jsx +++ b/lesson-04/remix-site/app/root.jsx @@ -1,21 +1,18 @@ import { Link, Outlet, LiveReload, Links, Meta, Scripts } from "remix"; -import globalStylesUrl from "~/styles/global.css"; +import styles from "./tailwind.css"; -export const links = () => [ - { - rel: "stylesheet", - href: globalStylesUrl, - }, -]; +export function links() { + return [{ rel: "stylesheet", href: styles }]; +} export const meta = () => ({ - description: "An example blog", - keywords: "remix, javascript", + description: "A recipe blog", + keywords: "recipes, food, jummy", }); export default function App() { return ( - + @@ -33,7 +30,7 @@ function Document({ children, title }) { {title} - + {children} {process.env.NODE_ENV === "development" ? : null} @@ -45,12 +42,12 @@ function Document({ children, title }) { function Layout({ children }) { return ( <> -