Spotify Social

This is a social app for users of Spotify to share their favourite tracks, discover new tunes and join discussions on tracks.

This project was bootstrapped with Create React App.

Inspiration

This is a project for our bootcamp with Birmingham University. We wanted to do something that incorporated the Spotify Api, to make an interactive application that is accessible to Spotify users. We worked as a team of 3, and started with the back end, which we tested using Graphql.

User Journey

As a user, I would like to create an account, be able to login, share tracks from Spotify and join discussions on music.

Acceptance Criteria

`I join the platform to share music or join in the discussions, WHEN I sign up or THEN I am presented with a login page with the option to login or signup.

WHEN the signup page is displayed THEN I am presented an input field with email, username, password.

WHEN I have signed up / logged in THEN I am presented with my dashboard with my username displayed.

WHEN I am signed in THEN I have the option to navigate to the all post page to view all the current music posts that exist and posted by other existing users. You also have the ability to leave a comment under that post.

WHEN I am on the all post page THEN I am given the option to post a music link that other users can listen to and reply to by leaving a comment on your post.

WHEN I have craeted a post THEN I have the ability to delete that post.`

Challenges

Getting the oEmbed to work Displaying the cards using Tailwind Working with Graphql and testing all the mutations Posting and deleting comments The Spotify Api - couldn't get it to work with Graphql

Future development

Launches the test runner in the interactive watch mode.
See the section about running tests for more information.

Technology used

We use the following technologies in the app:

React - For the frontend of the app. React is a JavaScript library for building user interfaces.
GraphQL - For the backend of the app. GraphQL is a query language for APIs and databases.
Apollo - For the backend of the app. Apollo is a GraphQL client for React.
tailwindcss - For the styling of the app. Tailwindcss is a utility-first CSS framework for quickly building custom components.
bcrypt - For the hashing of the passwords of the users. Bcrypt is a password hashing library.
express - For the backend of the app - used for the authentication of the users. Express is a web application framework for Node.js.
mongoose - For the backend of the app. Mongoose is a MongoDB object modeling tool designed to work in an asynchronous environment.
jwt For the authentication of the users. Jwt is a JSON Web Token library. It is used for the authentication of the users.
dotenv - for the configuration of the app - used for the authentication of the users. Dotenv is a library for loading environment variables from a .env file into process.env.
nodemon - for the restart of the app. Nodemon is a utility for restarting the server when files change. It is used for the restart of the app.
appollo-server-express - for the backend of the app. Apollo-server-express is a GraphQL server for Express. It is used for the backend of the app.