Surely-Expo

Official client for the Surely todo app. An Expo React Native app that builds to both iOS and web.

Backend is https://api.surelytodo.com. If you'd like to build the client yourself, you can still use the same backend, or you can set up your own installation of surely-api to point to.

Code Features

• Deployed to both iOS and web. Only blocker on Android is a dependency requiring intl support.
• Material Design with dark mode support on all platforms via React Native Paper.
• Navigation via React Navigation, including predictable web URLs and a drawer that smoothly transitions between persistent on large viewports and collapsible on small.
• Uses a custom styling library, react-native-style-queries, to apply responsive styles declaratively in a way inspired by media queries.
• Thoroughly tested via React Native Testing Library.
• Dependencies kept up-to-date with minimal effort: when tests pass and app boots, can be confident nothing's broken.
• Good accessibility labels, which I used via iOS Voice Control while I was experiencing some wrist pain.
• Since it is a "CRUD" app, uses JSON:API for the data layer to minimize client and server code needed to be written. Uses a custom client library, @codingitwrong/jsonapi-client.

Support

You have two options for getting support with Surely:

• Open a GitHub Issue on this repo
• Send a support email to support at surelytodo dot com

Requirements

• Node 20.x
• Yarn 1.x
• Expo CLI
• EAS CLI
• Cocoapods
• Fastlane
• Detox CLI

Requirements and npm dependencies can be installed by running bin/setup

Installation

$ yarn install

Running

Web/Expo Go

$ yarn start

Then click "Run on iOS simulator" or "Run in web browser"

Local iOS Build

• Open src/baseUrl.js and set a LOCAL_IP for the dev server

$ npx expo prebuild -p ios

• Open generated iOS .xcworkspace file in Xcode
• Set development team
• Under "Edit Scheme…" > "Info", change "Build Configuration" to "Release" to build in the JS
• Plug in physical device
• Build app onto physical device

Testing

Linting

$ yarn lint

Unit Tests

$ yarn test

End-to-End Tests (web)

• yarn start
• Click "Run in web browser"
• In another terminal, yarn cypress

Release

iOS

• Increment the ios.buildNumber in app.json
• Run yarn build:ios
• Once the build completes, upload the .ipa file it created to TestFlight using the Apple Transporter app.

If this doesn't work, do a prebuild (see instructions above) then archive the app in Xcode.

Web

$ npx expo export:web

• Copy the web-build folder to somewhere accessible on the public internet
• Configure the web server to route all paths that aren't found on disk to index.html; that way links to pages handled by React Navigation will all load up the app

License

MIT