apruner / my-fridge Goto Github PK
View Code? Open in Web Editor NEWMyFridge web app
License: MIT License
MyFridge web app
License: MIT License
It's possible that we might want to introduce redux (or some other state management lib) when more data starts flowing through the app. Let's consider it!
Deployment options:
CI/CD options:
Self explanatory! Follow sign in with google example and use firebase sdk to do everything
Add a CONTRIBUTING.md
file that guides new contributors!
This HUGE css file is auto-generated by gatsby, and we proooobably don't need it. Let's make sure we can get rid of it and then do it.
We'll obviously need some sort of navbar component through which to navigate the site! Let's use material ui's App Bar!
Self explanatory. Hook into firebase auth for MyFridge!
For now, the modal won't actually hook into firebase auth. It'll just be a mockup.
read into how replaceComponentRenderer works and check out gatsbyjs/gatsby#6127
Self explanatory, should have a button (and maybe "are you sure?" alert) to delete a shopping list from both the shopping lists or shopping list/id pages
Self explanatory! Test whatever components, worry about coverage later
Self explanatory
When a user first logs in to the app (basically when they create a fresh account with either user/pass or google), they'll need to fill out some initial data, such as creating a "household" for themselves, food preferences (types of foods they consider staples), etc
Let's create a form for this. It should be located at some sort of /profile/data
route or something like that. There's probably more to flesh out here.
Button/dialog to create a new shopping list (undefined as of right now, need to figure out what exactly this will look like)
Ideally we have some strict-ish eslint and prettier rules for things like:
strings: double quotes,
semi-colons: none,
indentation: 2spaces, etc
Add picture to each individual item in the list.
Avatar component from material-ui might be a good fit.
Since adding eslint and stuff, there are a bunch of code style warnings/errors. Let's fix em!
After fumbling around with these gatsby build issues, I've decided that we're gonna move to CRA! It'll just give us more freedom, and shouldn't be too too hard. :)
Dependent on issue #38
Click picture icon in shopping list to get a full screen image of the item.
Add .template.env file to the project for storing useful environment variable info like api keys and stuff
Edit the README.md
file so that it explains a bit more about what the project is trying to achieve
Once the login page has been mocked up, actually hook it into the firebase auth
Build out a page to select and then view a shopping list (dummy data for now)
Page should be at route /shopping-lists
On shopping list/id page, have a button/dialog for adding a new item to a shopping list
Let's add some stuff to the signin dialog:
On the Fridge page, we want to render a list of items (queried from the backend) that the user has in their fridge!
Mock this up with some dummy data
Self explanatory!
Libraries considered so far:
App framework: React + (Gatsby/Next.js/Create-React-App)
Component lib: Material UI (to match flutter App)
Testing: Jest + Enzyme
Other decisions to make:
Eslint: Airbnb standard? Google? None?
Type-safety: Flow/Typescript?
Like the mobile app, when the user is logged in, we want them to be able to navigate through pages in a slick way.
Options to pick from in the sidebar/dropdown nav:
More pages will be added here later, but for now this will do!
We will need a page/dialog to view a single shopping list.
This page will be navigated to from the general shopping lists page, and will have a URL route of /shopping-lists/{id}
This issue is dependent on #26
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.