Giter VIP home page Giter VIP logo

test-3dmz's Introduction

FaceApp

This app has been built to showcase the use of different tecnologies

  • React Native
  • Expo
  • Typescript
  • Javascript
  • Redux

Redux, was used because it was requested in the specs of the challenge. I wouldn't normally use it for this kind of scenario.

Pravatar takes a lot to return the images. This is why I've added a loader until the avar is ready to be displayed. After the first load, the image is chached and displayed immedialty

Description

FaceApp shows a list of rows containing details of mock people. The avatar and the name are shown.
When the app loads, it tries to fetch the data from the BE.
If an error occurs, an error is displayed with some details and a button retry will allow the app to reattempt the fetch.
A filter is available on the same page of the list of faces. The filter has been modelled on the behaviour of the Google Contacts App.

Use

Node v12.16.2

Install expo

npm install --global expo-cli

Start the app locally

npm i
expo start

If you are trying to use the BE hosted on localhost, you'll need to get your machine's local IP and change the constant localIP in the file: redux/faceList.ts

If the app is run locally and the local IP is not set, an error will be displayed. This is not the best solution...

Run unit tests

npm run test

The app can now be opened from the same network using the expo client or from an emulator running on the same machine.

Using the app with Expo

Android

Scan this code with the Expo client

iOS & Android

Click here (It's necessary to have the Expo client installed)

The app will use an instance of the BE running on a free Dyno on Heroku. The startup of the Dyno could take some seconds.

test-3dmz's People

Contributors

a-iasevoli avatar

Watchers

James Cloos avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.