├── .env.example ├── scripts ├── create-recipe-tables.sh ├── load-test-data.sh ├── recipe.sql ├── create-database.sh └── test-data.sql ├── server ├── validator.ts └── database.ts ├── next-env.d.ts ├── tsconfig.json ├── .gitignore ├── pages ├── index.tsx ├── api │ └── pictures.ts └── recipe │ └── [recipeId].tsx ├── package.json ├── common ├── types.ts └── constants.ts ├── README.md ├── components ├── SearchBar.tsx └── GridLayout.tsx └── yarn.lock /.env.example: -------------------------------------------------------------------------------- 1 | DB_USER=usernamehere 2 | DB_HOST=localhost 3 | DB_NAME=dbnamehere 4 | DB_PASSWORD=passwordhere 5 | DB_PORT=5432 6 | -------------------------------------------------------------------------------- /scripts/create-recipe-tables.sh: -------------------------------------------------------------------------------- 1 | ## gets the query from the recipe.sql file and runs it in postgres 2 | cat ./recipe.sql | docker exec -i cooking_server psql -U postgres -d cooking -------------------------------------------------------------------------------- /scripts/load-test-data.sh: -------------------------------------------------------------------------------- 1 | ## gets the query from the recipe.sql file and runs it in postgres 2 | cat ./test-data.sql | docker exec -i cooking_server psql -U postgres -d cooking -------------------------------------------------------------------------------- /server/validator.ts: -------------------------------------------------------------------------------- 1 | import Joi from "joi"; 2 | 3 | export const PicturesApiRequestSchema = Joi.object({ 4 | author: Joi.string().max(255).required(), 5 | pictureUrl: Joi.string().max(255).required(), 6 | description: Joi.string().max(255).allow(null) 7 | }); -------------------------------------------------------------------------------- /next-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | /// 3 | /// 4 | 5 | // NOTE: This file should not be edited 6 | // see https://nextjs.org/docs/basic-features/typescript for more information. 7 | -------------------------------------------------------------------------------- /server/database.ts: -------------------------------------------------------------------------------- 1 | import ServerlessClient from "serverless-postgres"; 2 | 3 | export const connection = new ServerlessClient({ 4 | user: process.env.DB_USER, 5 | host: process.env.DB_HOST, 6 | database: process.env.DB_NAME, 7 | password: process.env.DB_PASSWORD, 8 | port: Number(process.env.DB_PORT), 9 | debug: true, 10 | delayMs: 3000, 11 | }); 12 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "es5", 4 | "lib": ["dom", "dom.iterable", "esnext"], 5 | "allowJs": true, 6 | "skipLibCheck": true, 7 | "strict": false, 8 | "forceConsistentCasingInFileNames": true, 9 | "noEmit": true, 10 | "esModuleInterop": true, 11 | "module": "esnext", 12 | "moduleResolution": "node", 13 | "resolveJsonModule": true, 14 | "isolatedModules": true, 15 | "jsx": "preserve" 16 | }, 17 | "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"], 18 | "exclude": ["node_modules"] 19 | } 20 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # next.js 12 | /.next/ 13 | /out/ 14 | 15 | # production 16 | /build 17 | 18 | # misc 19 | .DS_Store 20 | *.pem 21 | 22 | # debug 23 | npm-debug.log* 24 | yarn-debug.log* 25 | yarn-error.log* 26 | 27 | # local env files 28 | .env.local 29 | .env.development.local 30 | .env.test.local 31 | .env.production.local 32 | 33 | # vercel 34 | .vercel 35 | 36 | # webstorm 37 | .idea 38 | -------------------------------------------------------------------------------- /pages/index.tsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import styled from "styled-components"; 3 | import { RecipeGrid } from "../components/GridLayout"; 4 | import { Search } from "../components/SearchBar"; 5 | 6 | const HeaderBar = styled.div` 7 | display: flex; 8 | flex-direction: row; 9 | align-items: center; 10 | `; 11 | 12 | const IndexPage = () => { 13 | return ( 14 |

15 | 16 | 17 | 18 | 19 |

20 | ); 21 | }; 22 | export default IndexPage; 23 | -------------------------------------------------------------------------------- /scripts/recipe.sql: -------------------------------------------------------------------------------- 1 | DROP TABLE IF EXISTS pictures; 2 | DROP TABLE IF EXISTS recipes; 3 | 4 | CREATE TABLE recipes ( 5 | id SERIAL PRIMARY KEY, 6 | author varchar(255), 7 | title varchar(255), 8 | description varchar(255), 9 | ingredients varchar(1024), 10 | steps varchar(65535) -- longest possible 11 | ); 12 | 13 | CREATE TABLE pictures ( 14 | id SERIAL PRIMARY KEY, 15 | author varchar(255), 16 | description varchar(255), 17 | picture_url varchar(255), 18 | recipe_id INT, 19 | CONSTRAINT fk_recipe FOREIGN KEY(recipe_id) REFERENCES recipes(id) -- picture should respond to one recipe 20 | ); -------------------------------------------------------------------------------- /scripts/create-database.sh: -------------------------------------------------------------------------------- 1 | #!/bin/bash 2 | set -e 3 | 4 | SERVER="cooking_server"; 5 | PW="mysecretpassword"; 6 | DB="cooking"; 7 | 8 | echo "echo stop & remove old docker [$SERVER] and starting new fresh instance of [$SERVER]" 9 | (docker kill $SERVER || :) && \ 10 | (docker rm $SERVER || :) && \ 11 | docker run --name $SERVER -e POSTGRES_PASSWORD=$PW \ 12 | -e PGPASSWORD=$PW \ 13 | -p 5432:5432 \ 14 | -d postgres 15 | 16 | # wait for pg to start 17 | echo "sleep wait for pg-server [$SERVER] to start"; 18 | SLEEP 3; 19 | 20 | # create the db 21 | echo "CREATE DATABASE $DB ENCODING 'UTF-8';" | docker exec -i $SERVER psql -U postgres 22 | echo "\l" | docker exec -i $SERVER psql -U postgres -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "scripts": { 4 | "dev": "next", 5 | "build": "next build", 6 | "start": "next start", 7 | "type-check": "tsc", 8 | "start-db": "cd scripts && ./create-database.sh", 9 | "create-recipe-table": "cd scripts && ./create-recipe-tables.sh", 10 | "test-data": "cd scripts && ./load-test-data.sh", 11 | "start-and-load-db": "yarn start-db && yarn create-recipe-table", 12 | "test-db": "yarn start-and-load-db && yarn test-data" 13 | }, 14 | "dependencies": { 15 | "@material-ui/core": "^4.12.3", 16 | "@material-ui/icons": "^4.11.2", 17 | "joi": "^17.4.2", 18 | "next": "latest", 19 | "react": "^17.0.2", 20 | "react-dom": "^17.0.2", 21 | "serverless-postgres": "^1.9.6", 22 | "styled-components": "^5.3.0" 23 | }, 24 | "devDependencies": { 25 | "@types/node": "^12.12.21", 26 | "@types/react": "^17.0.2", 27 | "@types/react-dom": "^17.0.1", 28 | "typescript": "4.0" 29 | }, 30 | "license": "MIT" 31 | } 32 | -------------------------------------------------------------------------------- /common/types.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * The database representation of a picture 3 | * @param recipeId optional for now, but in the future this might be required 4 | */ 5 | export type Picture = { 6 | id: number; 7 | author: string; 8 | pictureUrl: string; 9 | description: string; 10 | recipeId?: number; 11 | }; 12 | 13 | type BaseRecipe = { 14 | id: number; 15 | author: string; 16 | ingredients: string; 17 | steps: string; 18 | description: string; 19 | title: string; 20 | }; 21 | 22 | /** 23 | * The database representation of a recipe 24 | * @param photoIds references to photos/creations of this recipe 25 | */ 26 | export type Recipe = BaseRecipe & { 27 | pictureIds: Array; 28 | }; 29 | 30 | /** 31 | * The internap representation of a recipe after being processed from the database 32 | */ 33 | export type IRecipe = BaseRecipe & { 34 | pictures: Array