https://github.com/benschlegel/plantsense-app
https://github.com/benschlegel/plantsense-app
Last synced: 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/benschlegel/plantsense-app
- Owner: benschlegel
- Created: 2023-05-31T10:25:04.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2023-06-28T10:06:44.000Z (almost 2 years ago)
- Last Synced: 2025-01-23T20:29:09.472Z (4 months ago)
- Language: TypeScript
- Size: 646 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# PlantSense app
This is the main app repository of the `PlantSense` project. It also consists of a central web server ([repository here](https://github.com/benschlegel/PlantSense-webserver)) and the microcontroller, that reads data from sensors and controls an LED status indicator ([repository here](https://github.com/benschlegel/PlantSense-microcontroller)).
Full docs coming soon.
---
## Setup
After cloning the project, run:
```bash
npm install
```
If you are using vscode and still see errors/warnings in your files, try reloading the window.
To start the project, run:
```bash
npx expo start
```
Now, you can preview the app on your phone by downloading the `expo` app ([android](https://play.google.com/store/apps/details?id=host.exp.exponent), [ios](https://apps.apple.com/us/app/expo-go/id982107779)) on your phone and scanning the QR code from your terminal.
---
## Architecture
The project consists of 3 parts/repositories.
## Dependencies/Frameworks
This project is a 'managed' `expo` react native app (explanation link on expo [here](https://expo.dev/)).
### Routing
For navigation, [expo router](https://expo.github.io/router/docs/) is being used. That means that every folder in the `app` directory directly corresponds to a `route`, provided it contains `_layout.tsx` and `index.tsx`. This means that the `main` screen/route can be found under `app/(main)` and corresponds to the route `/(main)`.
---
## 📂 Project structure
This section goes into detail of how the project/app is structured.
---
* **📁`app`:** Contains main layout (`app/_layout.tsx`), entry point of app.
* *📄 `app/_layout.tsx`:* Contains the entry point of the app. Also responsible for registering screens and loading fonts.
* *📄 `app/index.tsx`:* Contains a redirect to control which screen gets loaded first.
---
* **📁`routes`:** Contains components that are used in main `App.tsx`.
* *📁 `app/main`:* Main screen of the app. Contains plant animation and notification/settings button.
* *📁 `app/setup`:* Screen for initial setup. Will be skipped automatically once setup has been completed once.
* *📁`app/notifications`:* View all notifications of your devices. Automatically refreshes to fetch new notifications.
---
* **📁`components`:** Contains all reusable and customizable components of this project. Some notable ones listed below.
* *📄`StyledText`:* `` component with set font-family. Can be passed `TextProps` to customize. Use everywhere instead of regular `` component
* *📄`StyledButton`:* Drop-in styled replacement for ``.
---
* **📁`constants`:** Contains configurable project constants like `Color` settings, ty and more
* **📁`helpers`:** Contains functions that are needed by multiple components. This includes functions that use `fetch` to make `http` network requests.
* **📁`assets`:** Contains project assets like `fonts` and `images`.
* *📁`assets/lottie`:* Contains lottie animation files.
---
* **📁`other`:** Configuration files
* *📄`.eslintrc.js`:* Contains eslint config for project
* *📄`app.json`:* Defines `expo`-configuration like `entryPoint`, `jsEngine`, app name etc.
* *📄`.gitattributes`:* gitattributes config, contains settings to set `EoL` (end of line) for every file so project can be used both on windows and mac/linux.