Tempo is a virtual booking agent that allows musicians to stay independent by mitigating the friction in the booking and gigging industry.
- This is a Full-Stack Application powered by React.js, SQL, express.js, and node.js. It follows a MVC framework with a RESTful API architecture. Additional technologies listed below!
We are currently under construction. Stay tuned for exciting updates!
Our mission is to provide an outlet that allows independent artists to progress their careers by booking shows, connecting with like-minded artists, and telling genuine and authentic stories.
Follow the deployed project link below to utilize the application.
See what we've got! Tempo
The page can be run from any browser, preferably on Google Chrome!
- React - Facebook-developed Javascript library for user interface (UI) development
- React Router - navigational component library for synchronizing the UI with the URL
- HTML5
- CSS3 - Unique, customized design and FlexBox
- Javascript - the primary scripting logic enabling our application
- Bideo.js - responsive video implementation
- Sketch App - detailed mockups
- Adobe Illustrator - icon design
- Adobe Photoshop - logo development
- Pexels - high-definition stock photos and videos
- Material UI - powerful design framework based on Google's Material Design principles
- Axios - promise based HTTP client for the browser and node.js. Also implemented in the backend
- React Reveal - animations
- React Scroll To Component - scrolling functionality
- React Chart JS - React-specific implementation of Chart.js, a well-developed graphing and charting infrastructure for Javascript
- React Calendar - Calendar implementation
- Express.js - backend server routing framework
require("express"); - MySQL2 - server-side relational database
require("mysql2"); - Sequelize.js - object-relational mapping (ORM) for SQL
require("sequelize"); - Passport.js - local-strategy login authentication
require("passport"); - Express Session -
require("express-session"); - Bcrypt - two-sided hash encrypting
- Axios - promise based HTTP client for the browser and node.js. A more robust option than the request npm package
require("axios"); - Body Parser - middleware technology for JSON formatting
require("body-parser"); - Cookie Parser - middleware parsing for cookies for headers and secrets
require("cookie-parser"); - Path - simplifies directories and filepaths through Node
require("path"); - Morgan - logging middleware for node.js HTTP apps ``` require("morgan"); `
We initially designed a rough wireframe outlining the core functionality of the application for our two principal user models. And artist or band would be able to log-in and see their calendar, local gigs that they can book, and relevant announcements. A venue would be able to see top bands and artists in their area with their relevant statistics.
Design Stage One
ReactJS provides a unique component-based architecture that allowed for precise development of our user interface. Here is a more digestible implementation of React that allowed for dynamic rendering of pertinent information on a SideSection component. The component absorbs properties from a higher level component and sends those properties to a lower component, SideItem, which renders numerous pertinent pieces of information for the user, depending on the goals of the page on which it renders. This dependant data is defined in the data prop which is passed to SideSection and then to SideItem and then finally to the generateItems function that renders the first five relevant elements in the data in the structure that is required, using JSX.
Explanation Chunk
Explanation Chunk
- Employ Redux for more effective state management
- Implement Socket.io for internal communication
- Establish a nodemailer system
- Further public profile functionality
- Develop a powerful rating system between bands and venues
| Task | Lead |
|---|---|
| Research, Logic and Execution | Andrew, Nasib, Kevin, Sajeel |
| Innovative Design | Kevin, Sajeel |
| ReactJS Implementation Success Team | Sajeel, Kevin |
| Authentication and Passport Execution | Nasib, Andrew |
| Database and Model Management with SQL and Sequelize | Nasib, Andrew |
| Routing and Controller Establishment | Andrew, Nasib |
This project is licensed under the MIT License - see the LICENSE.md file for details