Podcastr is a web app where you can listen to episodes of FalaDev Podcast. This project has been made during Next Level Week edition 5 with lessons of the React.js path.
- Node - Javascript Runtime
- React - a javascript library
- Next.js - an extremely powerfull React Framework
- Typescript - a JavaScript superset that brings data types and other usefull functionalities to JavaScript
- Styled-Components - a css in javascript library that is highly useful to do conditional styling
- Axios - used to work as an HTTP client and get data from the API in a way more organized than with
fetch
If you wanna run it locally:
- run
yarn
ornpm install
like any other Node.js project; - create a
.env
file withAPI_URL
passinghttp://localhost:3333
as value, for example; - run
yarn server
; - run
yarn dev
.
To build
and start
the project you need to be with the json-server running.
To deploy it online you will need to have an API to be already deployed and running somewhere and then add it's connection string (URL) to the environment variables of the platform where you are deploying the project. Deploy will fail if you ignore this step.
This is an academic project... You are resctricted to learn with it, copy, edit and... common, it's a free and open project, you can do ANYTHING that you want and this will never change!
- create this readme - 10
- bring back json-server, so I will not be lying in the "Run it Locally" section - 10
- create different themes and a option to change it from a button, menu or dropdown - 8
- create a playlist where person can add only the podcasts that she wants to hear - 5
- add a way to allow repeat only once instead repeating forever - 8
- add a way to repeat the full playlist instead of a episode - 10
- create a real external API with more episodes to show - 3
- make it responsive! - 6
First, lets understand the To Do list. The numbers of this To Do represents a confidence level from 0 to 10 where higher number means more confidence so the lowest, the number the harder and/or time consuming I think it is.
- You can create you own tasks to improve the project but If you are a begginner I recommend to start with a level 10 task.
- Instead of adding more To Do itens here, create tasks as ISSUES are it is a easier way to organize tasks if the project grows.
- Do semantic commits where we can see what was changed without needing to look the code.
As this project was made during a Rocketseat's event I can't forget to credit their staff for preparing the amazing lessons that directed this project to it's completion and of course Diego Fernandes for his amazing didatics.
During the week Carlos Miguel helped me with the URL of where he deployed his json file with the episodes. This URL is still being used and will be changed when I deploy a real API on Heroku.
Also I've used Dracula Theme (Classic) colors to define the default theme of this project, for that I also credit it's creators.