Making a simple app using React, Flask and MySQL.

Overview

Samys-Cookbook

Making a simple app using React and Flask.

What

  • This will be a simple site to host my recipes.
  • It will have a react front-end, a flask back-end with a Sqlite(for now atleast) db.
  • I will have to learn both react (from scratch) and flask (of which I do have a basic knowledge).\

My Plans

Front-End (made on 20211105 00:15:45, I don't know what will actually happen)

Nav bar

  • Home
  • Recipes
  • Skills
  • What can I make page
  • About

Home Page

  • A nice header image.
  • Display 5 (randomly) of each type of cards:
    • skills (how to do stuff like dice onions, boil your pasta, etc.)
    • recipes (actually making the stuff needed)
  • Recipe cards:
    • An image
    • The name of the dish.
    • The preparation time.
    • A short description.
    • The Difficulty level.
    • Veg or non-veg badge at the top.
  • Skills cards:
    • An image
    • The name of the dish.
    • The preparation time.
    • A short description.
    • The Difficulty level.
    • Veg or non-veg badge at the top.
    • How important the skill is

Recipes/skills Page

NOTE: These will be two separate pages

  • A list (maybe just a grid of cards) of all the recipes/skills (which can be filtered).
  • Clicking on which will open the page of the specific recipe/skill

Individual Recipe/skill pages

Separate pages for each (using templates i guess)

  • A header image
  • All the info on the card
  • Ingredients
  • Steps (clicking on a sentence which is a skill should include a link to that skill, for example: the line is 'boil your pasta until al dente', then it should be a link to the skill page of 'boiling pasta')
  • How to prepare or whatever else i will need

About Page

  • A link to my github, and socials(lol!).
  • And a short bio or such

What can I make page

  • The user should be able to select a number of ingredients. (and what to search: recipes or skills)
  • The site must then give back the possible recipes/skills which are possible with the given ingredients

Back-End

  • I need a rest api using flask
  • This is the first thing i will do

Routes:

  • /: the home page
  • /Recipes: the recipes page
  • /Skills
  • /Recipe/name: the page for an individual recipe
  • /Skill/name: the page for an individual skill
  • /get-recipes(workshop the name for this one): the page for the 'what can i make page', it will send a get/post (i don't know which) request which will return the
  • /about
  • There will be an easter egg, find it if you can ;)

DB

  • Look at the database_design.graphml (or .jpg) file.
  • I don't know how a db this complex will be stored, i might have to use plain sql cause i don't know how the flask sqlalchemy stuff works.
  • this is going to be tricky
Owner
Samridh Anand Paatni
Samridh Anand Paatni
SeCl - A really easy to deploy and use made-on Flask API to manage your files remotely from Terminal

SeCl SeCl it's a really easy to deploy and use made-on Flask API to manage your

ZSendokame 3 Jan 15, 2022
A simple web application built using python flask. It can be used to scan SMEVai accounts for broken pages.

smescan A simple web application built using python flask. It can be used to scan SMEVai accounts for broken pages. Development Process Step 0: Clone

Abu Hurayra 1 Jan 30, 2022
Python Flask API service, backed by DynamoDB, running on AWS Lambda using the traditional Serverless Framework.

Serverless Framework Python Flask API service backed by DynamoDB on AWS Python Flask API service, backed by DynamoDB, running on AWS Lambda using the

Andreu Jové 0 Apr 17, 2022
Flask + marshmallow for beautiful APIs

Flask-Marshmallow Flask + marshmallow for beautiful APIs Flask-Marshmallow is a thin integration layer for Flask (a Python web framework) and marshmal

marshmallow-code 770 Jan 05, 2023
An python flask app with webserver example

python-flask-example-keepalive How it works? Basically its just a python flask webserver which can be used to keep any repl/herokuapp or any other ser

KangersHub 2 Sep 28, 2022
Another redis monitor by using flask, angular, socket.io

RedisPAPA we use redis info to monitor the redis usage. PAPA means a father who is monitoring the redis. accoding to the redis doc, it is be recommand

no13bus 393 Dec 30, 2022
A simple FastAPI web service + Vue.js based UI over a rclip-style clip embedding database.

Explore CLIP Embeddings in a rclip database A simple FastAPI web service + Vue.js based UI over a rclip-style clip embedding database. A live demo of

18 Oct 15, 2022
A template for Flask APIs.

FlaskAPITempate A template for a Flask API. Why tho? I just wanted an easy way to create a Flask API. How to setup First, use the template. You can do

TechStudent10 1 Dec 28, 2021
OpenTracing instrumentation for the Flask microframework

Flask-OpenTracing This package enables distributed tracing in Flask applications via The OpenTracing Project. Once a production system contends with r

3rd-Party OpenTracing API Contributions 133 Dec 19, 2022
É uma API feita em Python e Flask que pesquisa informações em uma tabela .xlsx e retorna o resultado.

API de rastreamento de pacotes É uma API feita em Python e Flask que pesquisa informações de rastreamento de pacotes em uma tabela .xlsx e retorna o r

Marcos Beraldo Barros 4 Jun 27, 2021
Harmony, a discord clone, allows users to chat with other users in real time via servers, channels, and direct messages

Harmony, a discord clone, allows users to chat with other users in real time via servers, channels, and direct messages

Seth Holland 3 Feb 03, 2022
REST API with mongoDB and Flask.

Flask REST API with mongoDB py 3.10 First, to install all dependencies: python -m pip install -r requirements.txt Second, into the ./src/ folder, cop

Luis Quiñones Requelme 3 Mar 05, 2022
Forum written for learning purposes in flask and sqlalchemy

Flask-forum forum written for learning purposes using SQLalchemy and flask How to install install requirements pip install sqlalchemy flask clone repo

Kamil 0 May 23, 2022
A simple barcode and QR code generator built in Python with Flask.

✨ Komi - Barcode & QR Generator ✨ A simple barcode and QR code generator built in Python with Flask. 📑 Table of Contents Usage Installation Contribut

Bonnie Fave 2 Nov 04, 2021
A web application that consists of a collection of board games

PyBoardGame About This website contains a collection of board games for users to enjoy, as well as various guides for the games. The web app is built

Larry Shi 0 Aug 11, 2021
Seamlessly serve your static assets of your Flask app from Amazon S3

flask-s3 Seamlessly serve the static assets of your Flask app from Amazon S3. Maintainers Flask-S3 is maintained by @e-dard, @eriktaubeneck and @SunDw

Edd Robinson 188 Aug 24, 2022
A service made with Flask and Python to help you find the weather of your favorite cities.

Weather-App A service made with Flask and Python to help you find the weather of your favorite cities. Features Backend using Flask and Jinja Weather

Cauã Rinaldi 1 Nov 17, 2022
SQLAlchemy database migrations for Flask applications using Alembic

Flask-Migrate Flask-Migrate is an extension that handles SQLAlchemy database migrations for Flask applications using Alembic. The database operations

Miguel Grinberg 2.2k Dec 28, 2022
Sample Dockerized flask app deployed on Kubernetes on Azure using AKS

Sample Dockerized flask app deployed on Kubernetes on Azure using AKS

Ahmed khémiri 22 Sep 08, 2021
Formatting of dates and times in Flask templates using moment.js.

Flask-Moment This extension enhances Jinja2 templates with formatting of dates and times using moment.js. Quick Start Step 1: Initialize the extension

Miguel Grinberg 358 Nov 28, 2022