Tell Me Whats is a project initially created to be a platform that allows users who stream to create a room so that other users can send questions to them, and with the platform the questions are organized and ordered so that none of them go unanswered, which often happens when you do a live for a lot of people.
- Work In Progress ...
- ReactJS - A JavaScript library for building user interfaces
- Context API - Context provides a way to pass data through the component tree without having to pass props down manually at every level.
- Hooks - Hooks are a new addition in React 16.8. They let you use state and other React features without writing a class.
- Typescript - TypeScript is an open-source language which builds on JavaScript, one of the worldβs most used tools, by adding static type definitions.
- Firebase - Firebase provides the tools to build high-quality applications, broaden your user base and profit more. We take care of the basics so you can generate revenue in the business and be dedicated to users.
- Firebase Realtime Database - The Firebase Realtime Database is a cloud-hosted database. Data is stored as JSON and synchronized in realtime to every connected client.
- Firebase Authentication - Firebase Authentication provides backend services, easy-to-use SDKs, and ready-made UI libraries to authenticate users to your app. It supports authentication using passwords, phone numbers, popular federated identity providers like Google, Facebook and Twitter, and more.
- Create an Awesome (π) Readme (π)
- Install and configure ESLint Prettier Editor Config (π )
- Use Styled Components instead of SCSS (π)
- Create isolated file to Application Color Pallete (π¨)
- Implement Theme Switcher (π Light and Dark π)
- Implement Private Routes (π) to some routes
- Use an Modal instead an alert to confirm question deletion (π)
- Don't allow (π«) user join a closed room by url
- Try React Hook Form as a form manager (π¨βπΌ)
- Apply Responsivenes (π±βπ€)
- Add PWA support (β¬)
- Try Helmet to dynamic headers (π€)
- Implement Questions Tag Heatmap
-
To run any ReactJS application you need to configure the environment on your machine.
-
Setting the environment is a simple process, so it's recommended to follow the Rocketseat guide which is currently the most complete and detailed to make the settings:
- Clone this repo to your local machine using:
https://github.com/csorlandi/tell-me-whats
-
Install project dependencies;
yarn install // or npm install
-
Configure Firebase;
-
To configure correctly it's recommendede to follow a step-by-step guide:
-
-
Configure local environment variables;
- Change
.env.example
filename to.env.local
and fill the variables inside it with Firebase Credentials.
- Change
-
Run project in development mode;
yarn start // or npm run start
π‘ If your browser doesn't open the project automatically, open a new tab manually and access
http://localhost:3000
-
Be Happy! π
To get started...
- π΄ Fork this repo!
- π― Clone this repo to your local machine using
https://github.com/csorlandi/tell-me-whats
- π Create your feature branch using
git checkout -b my-feature
- β
Commit your changes using
git commit -m 'feat: My new feature'
;
- π Push to the branch using
git push origin my-feature
;
- π Create a new pull request
After your Pull Request is merged, can you delete your feature branch.
Reach out to me at one of the following places!
- Linktree at @csorlandi
- Linkedin at Claudio Orlandi
- Youtube at Claudio Orlandi
This project is licensed under the MIT License - see the LICENSE file for details.
Made with π Enjoy it!