Djent is an online sequencer that helps you make your own music.
Access here: https://djent-28b47.web.app
Djent was mainly built by React for front-end and Firebase for back-end.
I also used Tone.js for creating audio, scheduling audio and playing audio.
- Front-end:
- HTML5
- styled-components
- JavaScript
- React
- Tone.js
- Back-end:
- Firebase
- Hosting
- Cloud Firestore
- Authentication
- Firebase
- Variable sounds: There are seven different sound that you can use.
- Multitrack: You can add as many tracks as you like to your project.
- Editable note: Note can be applied with different length and pitch.
- Change key easily: With just one click, you can change key quickly.
- Save and load: After sign up for a membership, you can save or load your project.
-
From the index page, click the "get started" button to go to the editor page.
In editor page, you need to add new track first. Simply click the "edit track"
button, and select what track you want to add.

Here is the main area where you add or remove the note by clicking theses white buttons.
The note can be different length and pitch by using the control panel. Learn more about control panel.
Also, there are some buttons at the bottom of page, you can demo the sound of this track by clicking the button.
-
In Djent, basic note value is sixteenth note. In other words, these multiple number mean how many times of a sixteenth note.
You can switch to what note value you want by clicking these buttons.
Sharp and flat buttons will change the pitch of the note. Sharp button raised the note by half-step. Flat button lowered the note by half-step. To be much easier to tell if the note is sharp or flat, the color of note also changes when button clicked. Sharp button makes note green and Flat button makes note pink. The defalut note color is orange, if sharp or flat not applied.
Changing BPM will changes the playing speed of the project. Bigger value makes it playing faster and smaller one makes it slower. To change the BPM, click the number of BPM and type what value you like. The acceptable range of BPM is between 1 to 300. Default BPM is 120.
If you want to add more bars, click the plus button.
You can change the key by clicking plus and minus buttons, plus button raised the key by half-step and minus button lowered the key by half-step. Different key have different group of notes. There also have a major/minor button to change the key to major or minor. The difference between major and minor is interval.
If loop button clicked, it will loop the project when playing. Clicking again will cancel the loop.
This project is licensed under the terms of the MIT license.