Skip to content

JiggyDevs/twikkl-app

Repository files navigation

TwikkL Icon

Intro

Welcome ! This is the place to get started with TwikkL app. We introduce you to the very interesting topics and aspects. Also, we give support to mobile dev community to learn.

This app is intended to be a cross-platform DApp (for Android and iOS), that makes live-streaming, record, share videos and provide services.

NOTE:
If you are an experienced person and want to give us your support or point of view or if you are a beginner who would like to ask some questions feel free to contact us in Discussions .

Demo

This following demo animated image, represents the actual version of the app. Yes, it's still new 🤣

Expand 👈 demo-here

Getting started

Before you start make sure that you have at least ~15 minutes ⏱ to set up your dev environment.

The most important techs used are :

  1. ReactJS
  2. React Native (Without need for RN CLI)
  3. Expo Managed
  4. React Native Paper (This is a UI library)
  5. Expo Router (Smart routing)

NOTE:
Don't worry if you don't know few of these, it's fine 😅. But if you are totally new to these, then we recommend you to learn some basics. If so, we suggest you to follow the React Native basics guide

Next, make sure to install the following tools on your local machine and Os:

  1. Node.js (We recommend LTS version v16 or higher)
  2. A JavaScript IDE such as VsCode/Webstorm etc...
  3. Git installed (visit the GitHub's guide on how to set up Git)

You can run the app for free, by using Expo Go App (available on Android and iOS), it makes you run the app on a physical device.

If you want to use emulator or iOS simulator, we recommend you to visit the following links:

If you want to run the app on web navigator like Chrome or Mozilla, then you'll have to add few additional dependencies.

Deploy locally

Once you're ready with the tools mentioned above, you can import source code using Git CLI with the following command:

git clone https://github.com/JiggyDevs/twikkl-app.git
  1. Next, install the app using npm: npm install)

  2. run the following command from the project root directory:

npx expo start

NOTE:
If you're looking to use Yarn then you have to delete the package-lock.json file just after the clone. Then, use yarn install to install dependencies.

Navigation

We use Expo Router as a small framework to manage routing. All screens are defined under /app folder. Currently, there are few pages to test the navigation (Register and Home).

We think that navigation business logic can become much better as the app grow and state management is up.

Styling

The styling integration must follow the design prototype, which is currently exposed as few examples under /docs folder.

If you are interested in watching all examples (the design roadmap), we invite you to use our Figma link 😉, just create a free account, and you're to download it.

Also, notice the theme setup in theme.ts file, this configuration is made following React Native Paper theming guide.

Finally, as for the icons, following the Expo icons guide we use IcoMoon tool to generate our own icon-set.

Contributing

Please see the contributing guide for detailed instructions on how to get started with us. We accept any sort of help that can make this project better, even a word like "Good luck!" 😍.