Skip to content

Latest commit

 

History

History
79 lines (60 loc) · 3.02 KB

README.md

File metadata and controls

79 lines (60 loc) · 3.02 KB
Raw

Setup

Firebase Setup

  • npm install firebase

Useful video for setup

Design Features

  • Accent color: white
  • Color for buttons: #132235

Web Equivalents

  • Expo ~ Vite.js and React.js
  • Native Wind ~ Tailwind CSS

Structure

  • app Folder: Contains the main app structure. The index.tsx file here serves as the entry point, similar to index.js in a JavaScript setup. This file typically sets up the app's root component and navigation

  • app --> (tabs) --> index.tsx: entry point/ home screen

  • app --> (tabs) --> _layout.tsx: Configures tab navigation and screen options

  • assets Folder: Stores static resources like images, fonts, and other media files

  • components Folder: Contains reusable React components used throughout the app e.g buttons, etc

  • constants Folder: Holds constant values and configuration settings used in the app

  • hooks Folder: Contains custom hooks for reusable logic

  • node_modules Folder: Contains all the installed npm packages

  • scripts Folder: May include custom scripts for tasks like building or deploying the app

  • app.json: Configuration file for your app, including settings for Expo or React Native CLI

  • babel.config.js: Configuration file for Babel, used to transpile your code

  • tsconfig.json: TypeScript configuration file that defines how TypeScript should compile your code

Where to get icons

Font Weight Values

  • 100: Thin (Hairline)
  • 200: Extra Light (Ultra Light)
  • 300: Light
  • 400: Normal (Regular)
  • 500: Medium
  • 600: Semi Bold (Semi Bold)
  • 700: Bold
  • 800: Extra Bold (Heavy)
  • 900: Black (Ultra Bold)

Firebase Setup

  • configure firebase first (set up project in firebase)
  • npm install firebase
  • register app as web app
  • copy code for config file, create config.tsx file and paste it there
  • firestore setup- addDoc, getFirestore, collection, getDocs, deleteDoc, Timestamp, query, orderBy, onSnapshot
  • each collection has number (unique), location, theme, verse

Firestore Functions

  • collection: retrieves a reference to a specific collection in Firestore, where documents are stored

  • addDoc: adds a new document to a specified collection, allowing one to store data in Firestore

  • Timestamp: a utility that represents a point in time, often used to record when a document was created or updated

  • query: creates a query object that can be used to filter documents from a collection based on specific criteria

  • where: adds a condition to a query, allowing one to filter documents based on specific field values

  • getDocs: retrieves the documents that match a given query, returning the results for further processing

  • deleteDoc: removes the current verse from a collection

Verses
  • Total: 328 verses
  • Grace- 58 verses, Love- 64 verses, Hope- 59 verses, Résilience- 68 verses, Faith- 80 verses