eddielee394 / react-my-eats Goto Github PK
View Code? Open in Web Editor NEWDemo recipe manager. Check develop branch for latest activity.
Demo recipe manager. Check develop branch for latest activity.
Create a view to add and update recipes or specials. Image upload not required. Both endpoints support GET, POST and PATCH.
Search Params
custom wrapper component to handle loading indicators for optimistic ui rendering & React.Suspense
defaults for component lazy loading.
Ingredients with a matching ingredientId
listed in the specials response should also show the special title
, type
and text
under the ingredient name
Initial project planning and codebase setup.
When data is returned from a response, currently I'm using an inline loop to handle validating any data contained within arrays deeply nested in the response object.
Ideally I'd like to avoid inline logic within the validation schema & instead abstract that logic into a separate method validateApiResponse()
. This would check if the response object contains any nested arrays & if so, then map over them comparing each iteration to the parent object schema.
Approaches taken so far
for in
loop and hasOwnProperty()
, I'm able to do a shallow mapping that checks if there are multiple top level objects in the response and validate those individually, but it doesn't handle nested arrays within the top level objects. let data = {};
for (let key in response.data) {
if (response.data.hasOwnProperty(key)) {
data[key] = convertData(response.data[key]);
}
}
map()
over any known nested arrays. The trade-off with this approach is that it requires us to know whether the incoming response object contains any arrays before hand, in order to loop over them in the validation schema. const convertData = data => {
return {
uuid: data.uuid,
title: data.title,
//...
directions: data.directions.map(d => {
return {
instructions: d.instructions,
optional: d.optional
};
})
};
};
//...
const rawData = response.data;
const data = rawData.map(d => convertData(d));
Possible Solutions
layout ui design, & styling
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.