Letmeask

This app was developed in a programming course of reactJs of the Rocketseat online school, in the Next Level Week event for programing of all levels.

This app is a SPA bootstrapped with [Create React App] and, basically, creates a place that monitors can communicate with their audience in real time while receive questions that are sort by likes / votes by the people in audience in real time, this way, the monitor can easily know what question to answer and to mark it how answered while continue receiving new questions, it is possible to delete an unwanted question or highlight an good question too.

The data is all stored in the firebase realtime database, except by the theme (dark/default or light) chosen by each user, it stay in the local storage.

Originally it was only this, but I decided to insert more functions in it that are next:

Now, the monitors can insert video link of any video providers like youtube, vimeo, dailymotion, twitch and many others, to this, I used the ReactPlayer in a simple but eficient implementation; the users can choose under two options of theme (dark or light), and the layout is responsive now, to be displayed in any format and size screen.

Technology

Here are the technologies used in this project.

• react version 17.0.2
• react-dom version 17.0.2
• react-player version 2.9.0
• react-router-dom version 5.2.0
• react-scripts version 4.0.3
• react-switch version 6.0.0
• classnames version 2.3.1
• firebase version 8.6.8
• node-sass version 5.0.0
• typescript version 4.1.2
• web-vitals version 1.0.1

Services Used

• Github
• Firebase from Google

Getting started

You can see and use the app here

But, if you want to run this app by yourself, simply create a firebase app here

In next, you need to write the app credentials in a file ".env.local" in the root directory like it:

# Firebase
REACT_APP_API_KEY="asdfsadfasdfasdf"
REACT_APP_AUTH_DOMAIN="asdfasdfasdfasdf.firebaseapp.com"
REACT_APP_DATABASE_URL="https://asdfasdfasdfasdf.firebaseio.com"
REACT_APP_PROJECT_ID="asdfasdfasdfasdf"
REACT_APP_STORAGE_BUCKET="asdfasdfasdfasdf.appspot.com"
REACT_APP_MESSAGING_SENDER_ID="1234324234234"
REACT_APP_APP_ID="1:234132412341234:web:qwerqwe986796987qw6er"

In next, you need to run "yarn start" to run the local test server and to test the app locally.

How to use

You can create a Room with your personal Google account with the name you want, in next, ou can paste the link of the live of any platform alowed by react-player version 2.9.0, and for last, copy the room link and share with your audience, it is free for all.

Features

• With this app, you can create a place that you can communicate with your audience in real time while receive questions that are sort by likes / votes by the people in audience in real time, this way, you can easily know what question to answer and to mark it how answered while continue receiving new questions, it is possible to delete an unwanted question or highlight an good question too.

Links

• Link of deployed application: https://letmeask-f38c5.web.app/
• Repository: https://github.com/teilorbarcelos/letmeask
  • In case of sensitive bugs like security vulnerabilities, please contact OUR EMAIL directly instead of using issue tracker. We value your effort to improve the security and privacy of this project!

Versioning

1.0.0.0

Authors

• TEILOR SOUZA BARCELOS: @teilorbarcelos (https://github.com/teilorbarcelos)

Learn More

You can learn more in the [Create React App documentation].

To learn React, check out the [React documentation].

I hope it help you like it helped me too! Thanks for see it and give a repo star if you like it!

letmeask