VoxBox is a social platform made by students in HYF Belgium that is aimed to connect both volunteers and help seekers within a community so that we can focus on channeling our inner good and assist each other to build a stronger foundation of a better world.
- About VoxBox
- Tools and Technologies
- Contribution
- Contact
- License
- General
- Development
- Deployment
- Testing
- Helpful Links
VoxBox is a social platform that is aimed to connect volunteers and people who needs some help within a community. VoxBox is made by students in HackYourFuture Belgium as a part of final assignment after following eight months of a solid coding course. This project is inspired by daily difficulties faced both in 2020 during the COVID-19 pandemic and in any other regular days. The team hopes that providing help could be a part of our daily activities as social beings.
Why Volunteer?
Volunteering within a community is a natural way to meet contacts and know our surrounding. Volunteering is also a great example of compassion, solidarity and responsibility - HelpGuide
- Figma - Design
- HTML
- CSS
- JavaScript
- React.js
- Redux
- Bootstrap
- React Bootstrap
- Node.js
- Express.js
- MySQL
- Sequelize
- Heroku
- Fork the Project
- Create your Feature Branch (git checkout -b new-branch)
- Commit your Changes (git commit -m 'Add some AmazingFeature')
- Push to the Branch (git push origin new-branch)
- Open a Pull Request
You can contact the people who work on this project
- Gelila Ali - Github / LinkedIn
- Mame Azad - Github / LinkedIn
- Yıldıray Koyuncu - Github / LinkedIn
- Anna Ikoki - Github / LinkedIn
- Oguz Karademir - Github / LinkedIn
- Miroslav Veljanoski - Github / LinkedIn
- Adek Impianna - Github/ LinkedIn
Distributed under the MIT License. See LICENSE for more information.
A model of how you can set up your project for development, testing & deployment.
This application reads the secrets from a .env file at the root of this project. A secret is something you don't want to commit to a public repository. The password for your database for instance. A node package dotenv is used to read and parse this file and provides an interface we can use.
Create a file called .env to the root.
DB_HOST=YOUR_IP_OR_DOMAIN
DB_NAME=YOUR_DATABASE_NAME
DB_USER=YOUR_DATABASE_USER
DB_PASSWORD=YOUR_DATABASE_USER_PASSWORD
JWT_SECRET=A_JWT_SECRET_A_RANDOM_STRING_OF_CHARACTERS
DB_HOST A domain or IP the host of your database.
DB_NAME The name of your database. The application will connect to this database.
DB_USER User used to authenticate to the database. Typically a user called root is created in MySQL. Although it is not recommend to use that user in production.
JWT_SECRET Within the app a standard called JWT is used to manage authorization. This requires a random complicated password like string to sign tokens.
Make sure you configure your secrets in line with your development environment. See the configuration section.
Install backend dependencies.
npm install
Install frontend dependencies
yarn install
Your application will need to persist data. The interaction with the database is abstracted by an ORM (Object role modelling) called Sequalize .
Make sure you configure your secrets in line with your development environment. See the configuration section. You can create the database and tables by running the sync.js script.
node api/scripts/sync.js
Optionally you can seed the tables with some test data by running:
node api/scripts/seed.js
To develop just the API separately from the frontend run:
npm run dev-apiThis will run your api as though it were part of the full live project. All routes will be have api/ appended before them and a get request to / will return the string "frontend"
To develop just the frontend separately from the API run:
npm run dev-clientDISCLAIMER! this will only work if you have set up a mock-api
You can also develop the frontend and API in parallel by running:
npm run devThis script will run the frontend and backend on separate ports, the backend on localhost:5000 with nodemon. The frontend will be run using create-react-app's start script, redirecting all API calls to localhost:5000.
You can find more details on the Instalation Wiki page
The main index.js in this directory is for deployment. It provides access to your api behind /api and statically serves the client from /client/build. You can copy-paste this file directly, there should be need to modify it for your project.
In order for your project to run on Heroku, the main package.json needs a start command. This is already taken care of for you.
To mock deployment on your local machine you can run these commands. The app will build and run the same as it will on Heroku to help you troubleshoot your deployed project locally.
npm run heroku-postbuild
npm run startCreate a Heroku account and install the Heroku cli. Verify the installation with
heroku statusInitialize Heroku inside the project folder by using:
heroku createNote it is likely you want to create the app with some options, a useful for the project.
You can deploy your project from your local machine by pushing to the Heroku master repository.
git push heroku master
To locally execute your tests, run the following commands
cd client
npm installcd api
npm installTest run on each commit on the master branch using Github actions. The configuration can be found in .github/workflows/node.js.yml.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent