Skip to content

glodzl/react-native-tech-test

 
 

Repository files navigation

App was built using React Native, JavaScript, Expo, GraphQL Apollo, Redux, React Navigation.
Bonus features: dark mode support, fetch debounce, only loads 25 recipes first, can save favourite recipes.
Images are left out of the app because they do not load outside of the UK, due to server security settings. Expo link: https://expo.io/@glodzl/react-native-tech-test

Recipe App

We'd like a very simple mobile app for using our recipes. It should allow users to search for recipes and view them.

Essential requirements

  • Built using React Native and modern JavaScript. Do not use ClojureScript, Dart, Elm, F#/Fable, Go, ....1
  • Works on both iOS and Android devices
  • Makes good use of the viewport on mobiles and tablets in portrait and landscape
  • Provides a simple, but responsive, recipe search using our GraphQL API (details at the end of this document)

Guidance

The goal of this test is for you to demonstrate your experience and abilities for building cross-platform mobile apps. Show us an app that's simple to maintain and behaves well on different mobile devices. We may test your app on real or emulated mobile devices, running Android, iOS or iPadOS; you needn't support smart watches!

Your app should look good, perform smoothly, and not consume gigabytes of storage on the device.

More recipes are added all the time.

Use whatever third-party modules you feel are appropriate, but be prepared to justify your choices.

Sophisticated searching, e.g. using facets, is out-of-scope; you can use whatever results the API returns from a simple text search.

Submission

Please host your submission on GitHub by forking this repository. Let me know when you're happy with it by emailing a link to richardturner@riverford.co.uk; when you do so, please give me an indication of how long you spent on the test.

Have fun!

API

Use our recipe_search and recipe API queries to fetch recipe information. The API uses GraphQL, and is accessible at https://next.riverford.co.uk/graphql. The recipe query takes a slug as its sole parameter; the recipe_search query takes the following parameters, where q is the search query string:

recipe_search params
ParamTypeDefault
pageInt1
page_sizeInt100
qString-

Relevant response types:

RecipeSearchResult
FieldType
total_hitsInt
hits[RecipeSearchHit]
RecipeSearchHit
FieldType
recipeRecipe
scoreDecimal
Recipe
FieldType
cook_timeDuration
ingredients[RecipeIngredientSection]
introductionString
media[Media]
method[RecipeMethodSection]
nameString
notesString
prep_timeDuration
servesLong
short_descriptionString
slugString
tags[String]
total_timeDuration
RecipeIngredientSection
FieldType
componentString
ingredients[String]
RecipeMethodSection
FieldType
componentString
steps[String]
Media
FieldType
altString
captionString
content_typeString
heightInt
master_uriString
optimisedBoolean
tags[String]
uriString
widthInt

1 Much as I might like to see these, they're not appropriate for this test.

About

Technical test for our Senior Engineer vacancy

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 100.0%