Giter VIP home page Giter VIP logo

hackernewsrn's Introduction

Hacker News - React Native

Overview

This project is setup to follow Unidirectional Data Flow and Single Source of Truth approach. We mainly use Redux as well as TypeScript for better typed coding.

Core consideration
  • Edge to Edge screen support
  • Infinite loading pattern on Stories and Comments
  • Redux for View State management and Unidirectional Data Flow
  • Following Clean Architecture principal
  • Use only Hooks and Functional component

Prerequisite

  • Node >= 16.10
  • Xcode for iOS (To run iOS on Mac)
  • Ruby == 2.7.4 (only needed for cocoapods on Mac)
  • Bundler >= 2.3.10 (to make sure everyone has same cocoapods version for this project)
  • Java JDK (Install Android Studio come with JDK, and setup your JAVA_HOME with the JDK come with Android Studio)
  • Yarn v1 (a.k.a. classic)

Prerequisite installation

Install Android Studio

You can install Android Studio via Jetbrains Toolbox to easier manage multiple version of Studio or The Official Website

Remember to setup JAVA_HOME and ANDROID_HOME by following the React-Native Website

Install Yarn (Ensure you are using Node >= 16.10)

corepack enable

Note: If you are Yarn v2+, you will need to fallback to Yarn v1 because we are using prepare lifecycle script for cocoapods.

Run below comment and delete all related .yarn* files in the project

yarn set version classic

Initial project

Just Yarn, don't worry about cocoapods if you follow the MacOS setup instruction

yarn

TODO

  • More code coverage
  • Offline caching for feed
  • Handle device offline or Pull-to-Refresh and Next page loading
  • Display more friendly error message, such as Offline
  • Display error message when user doing Pull-to-Refresh with some kind of SnackBar pattern
  • Handle error for next page fetching

Screenshots

Android

Stories - Android

Comments - Android

iOS

Stories - iOS

Comments - iOS

hackernewsrn's People

Stargazers

 avatar

Watchers

 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.