{"id":18587120,"url":"https://github.com/tjas/tjas-aluratube","last_synced_at":"2026-04-08T20:03:31.963Z","repository":{"id":172370252,"uuid":"564574845","full_name":"tjas/tjas-aluratube","owner":"tjas","description":"Project developed at Alura's React Immersion 2022 and evolved after, to practice React and other user interface technologies.","archived":false,"fork":false,"pushed_at":"2024-07-10T16:25:46.000Z","size":3625,"stargazers_count":1,"open_issues_count":4,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-05-16T06:36:23.503Z","etag":null,"topics":["aluratube","front-end","imersao-react","javascript","next","nextjs","node","nodejs","react","reactjs","tjas","tjas-aluratube","ui","user-interface","youtube"],"latest_commit_sha":null,"homepage":"https://tjas-aluratube.vercel.app/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/tjas.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null},"funding":{"github":"tjas"}},"created_at":"2022-11-11T02:12:16.000Z","updated_at":"2023-01-02T14:50:42.000Z","dependencies_parsed_at":null,"dependency_job_id":"af98c4a9-19e7-40a1-919e-bd89672edee8","html_url":"https://github.com/tjas/tjas-aluratube","commit_stats":null,"previous_names":["tjas/tjas-aluratube"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/tjas/tjas-aluratube","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tjas%2Ftjas-aluratube","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tjas%2Ftjas-aluratube/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tjas%2Ftjas-aluratube/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tjas%2Ftjas-aluratube/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/tjas","download_url":"https://codeload.github.com/tjas/tjas-aluratube/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tjas%2Ftjas-aluratube/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31571601,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-08T14:31:17.711Z","status":"ssl_error","status_checked_at":"2026-04-08T14:31:17.202Z","response_time":54,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["aluratube","front-end","imersao-react","javascript","next","nextjs","node","nodejs","react","reactjs","tjas","tjas-aluratube","ui","user-interface","youtube"],"created_at":"2024-11-07T00:38:47.722Z","updated_at":"2026-04-08T20:03:31.934Z","avatar_url":"https://github.com/tjas.png","language":"JavaScript","funding_links":["https://github.com/sponsors/tjas"],"categories":[],"sub_categories":[],"readme":"# TJAS AluraTube\n\n[![Status](https://img.shields.io/badge/status-active-brightgreen.svg?label=Status)](./README.md)\n[![Website](https://img.shields.io/website?down_color=brightred\u0026down_message=offline\u0026up_color=brightgreen\u0026up_message=online\u0026url=https%3A%2F%2Ftjas-aluratube.vercel.app%2F\u0026label=Website)](https://tjas-aluratube.vercel.app/)\n[![Hits](https://hits.seeyoufarm.com/api/count/incr/badge.svg?url=https%3A%2F%2Fgithub.com%2Ftjas%2Ftjas-aluratube\u0026count_bg=%2379C83D\u0026title_bg=%23555555\u0026title=Hits\u0026edge_flat=false)](https://hits.seeyoufarm.com)\n[![Licence](https://img.shields.io/github/license/tjas/tjas-aluratube?color=orange\u0026label=Licence)](https://github.com/tjas/tjas-aluratube/blob/master/LICENCE)\n[![Commits](https://img.shields.io/github/commit-activity/t/tjas/tjas-aluratube?label=Commits)](https://github.com/tjas/tjas-aluratube/graphs/commit-activity)\n![Last commit](https://img.shields.io/github/last-commit/tjas/tjas-aluratube?color=blue\u0026label=Last%20commit)\n![Repo size](https://img.shields.io/github/repo-size/tjas/tjas-aluratube?color=888888\u0026label=Repo%20size)\n![Code size](https://img.shields.io/github/languages/code-size/tjas/tjas-aluratube?color=888888\u0026label=Code%20size)\n[![Stars](https://img.shields.io/github/stars/tjas/tjas-aluratube?color=blue\u0026label=Stars)](https://github.com/tjas/tjas-aluratube/stargazers)\n[![Watchers](https://img.shields.io/github/watchers/tjas/tjas-aluratube?color=blue\u0026label=Watchers)](https://github.com/tjas/tjas-aluratube/watchers)\n[![Forks](https://img.shields.io/github/forks/tjas/tjas-aluratube?color=blue\u0026label=Forks)](https://github.com/tjas/tjas-aluratube/forks)\n\n[![Node](https://img.shields.io/badge/Node-v18.12.1-green)](https://nodejs.org/en/)\n[![Next](https://img.shields.io/badge/Next-v13.0.2-yellow)](https://nextjs.org/)\n[![React](https://img.shields.io/badge/React-v18.2.0-orange)](https://reactjs.org/)\n\n\u003e ⭐ Mark the project with a star. 👀 Watch the project for receive news.\n\u003e\n\u003e ⚙️ [Access the demo and see the project working](https://tjas-aluratube.vercel.app/).\n\u003e\n\u003e 🇧🇷 Acesse a versão em [Portuguese do Brasil](./README_pt-br.md) desta página.\n\u003c!-- \u003e\n\u003e 🌐 Access my personal website: [thiago-tjas.com](http://thiago-tjas.com/) --\u003e\n\nThis project is an adaptation and evolution of the **[AluraTube](https://github.com/alura-challenges/aluratube)** project, proposed at [Alura](https://www.alura.com.br/)'s 5th React Immersion, that occured in november 2022. It initially intended to spread basic knowledgements about [ReactJS](https://reactjs.org/) technology, but became an opportunity do practice and evolve personal skills in such technology and other related ones.\n\n\u003cbr /\u003e\n\u003cp align=\"center\"\u003e\n    \u003cimg alt=\"Preview\" src=\"./screenshots/preview light.png\" width=\"800\" /\u003e\n\u003c/p\u003e\n\u003cbr /\u003e\n\nThe **React** is a [JavaScript](https://www.javascript.com/) library created by Facebook for building modern user interfaces, known as front-end applications, which are connected to back-end applications, that serves content and manage negocial rules in complex systems. The React runs over the [NodeJS](https://nodejs.org/en/), an open-source, cross-platform JavaScript runtime environment, and is potencialyzed by other libraries and frameworks, mainly the [NextJS](https://nextjs.org/), a very popular framework, wich is even used in this project.\n\nThe TJAS AluraTube is a video platform inspired by [YouTube](https://www.youtube.com/). However, the **TJAS AluraTube** does not intend to be an YouTube's copy, but even go beyond: taking the project developed at React Immersion as starting point, but proposing some innovative features that just refer to YouTube as the main videos and contents provider. Alura and AluraTube are trademarks of _AOVS Sistemas de Informática S.A._, all rights reserved. YouTube is a trademark of _Google LLC_, all rights reserved.\n\n## Getting Started\n\nThis is an example of how you may set up the project locally in your computer. To get a local copy up and running follow these steps:\n\n1. Make sure you have Node.JS 18.12.1+ with npm 8.19.2+ installed or do it from [NodeJS.org](https://nodejs.org/en/download/);\n2. Make sure you have Git installed or do it from [Git-scm.com](https://git-scm.com/);\n3. Access the folder you want to save the project, then clone the repo there\n    ```sh\n    git clone https://github.com/tjas/tjas-aluratube\n    ```\n4. Access the project folder;\n5. Install the project dependencies (obtained by default from `package.json` file)\n    ```sh\n    npm install\n    ```\n6. Run the application\n    ```sh\n    npm run dev\n    ```\n7. Finally, access the aplication at http://localhost:3000\n\n## Contributing\n\u003c!-- \u003e Adapted from the [\"Flappy Bird: Dev Soutinho\"](https://github.com/omariosouto/flappy-bird-devsoutinho/blob/master/CONTRIBUTING.md) project. --\u003e\n\n1. Fork it!\n2. Create your feature branch:\n    ```sh\n    git checkout -b my-new-feature\n    ```\n3. Add files changed:\n    ```sh\n    git add .\n    ```\n4. Commit your changes:\n    ```sh\n    git commit -m \"Add some useful comment here\"\n    ```\n5. Push to the branch:\n    ```sh\n    git push origin my-new-feature\n    ```\n6. Submit a [pull request](https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/proposing-changes-to-your-work-with-pull-requests/creating-a-pull-request)\n    * Add a title and description that let clear your suggestion;\n    * Use the English language for comments and branch names;\n    * After your pull request is merged, you can safely delete your branch.\n\n## Todo List\n\n* [ ] Obtain a list of videos dinamically from [Google API](https://www.npmjs.com/package/googleapis);\n* [ ] Add fade efect in horizontal scrolls extremities;\n* [ ] Create, edit and remove playlists;\n* [ ] Add and remove videos;\n* [ ] Add and remove favorites;\n* [ ] Edit user profile informations;\n* [ ] Persist informations in local data base;\n* [ ] Translate to other languages;\n* [ ] Create login page;\n* [ ] Separate public and private pages.\n\n## References\n\n* [Node.JS LTS version](https://nodejs.org/en/);\n* [npm documentation](https://docs.npmjs.com/);\n* [React.JS documentation](https://reactjs.org/docs/getting-started.html);\n* [Next.JS documentation](https://nextjs.org/docs/getting-started);\n* [Styled Components documentation](https://styled-components.com/docs);\n* [next.config.js file of Styled Components examples](https://github.com/vercel/next.js/blob/canary/examples/with-styled-components/next.config.js), for using React with Next;\n* [GitHub's API](https://api.github.com/users/tjas);\n* [Supabase documentation](https://supabase.com/docs);\n* [Supabase-JS](https://www.npmjs.com/package/@supabase/supabase-js);\n* [Using the Effect Hook](https://en.reactjs.org/docs/hooks-effect.html).\n\n## Other interesting links\n\n* [Figma](https://www.figma.com/);\n* [Visual Studio Code](https://code.visualstudio.com/), development interface;\n* [Unsplash](https://unsplash.com/), for free images;\n* [Material Design components](https://m3.material.io/components);\n* [Vercel's GitHub profile](https://github.com/vercel);\n* [Styled Components official using examples](https://github.com/vercel/next.js/tree/canary/examples/with-styled-components);\n* [Alura's Github \"Alura Challenges\" profile](https://github.com/alura-challenges), cool projects for reference;\n* [Project \"Flappy Bird: Dev Soutinho\"](https://github.com/omariosouto/flappy-bird-devsoutinho/blob/master/CONTRIBUTING.md);\n* [Project \"Awesome Design Systems\"](https://github.com/alexpate/awesome-design-systems), for design systems reference;\n* [Alura Verso](https://www.alura.com.br/aluraverso);\n* [TechGuide.sh](https://techguide.sh/), a roadmap for technology career;\n* [Vitrine Dev](https://cursos.alura.com.br/vitrinedev);\n* [Babel](https://babeljs.io/), a JavaScript compiler;\n* [QUOKKA](https://quokkajs.com/), a JavasCript coding support tool;\n* [Supabase](https://supabase.com/).\n\n## Contact\n\n**Thiago Jorge Almeida dos Santos**, project author and maintainer.\n\n[![LinkedIn](https://img.shields.io/badge/-LinkedIn-blue?style=flat-square\u0026logoColor=white\u0026link=https://www.linkedin.com/in/thiago-tjas)](https://www.linkedin.com/in/thiago-tjas) [![YouTube](https://img.shields.io/badge/-YouTube-FF0000?style=flat-square\u0026logoColor=white\u0026link=https://www.youtube.com/@thiago_tjas)](https://www.youtube.com/@thiago_tjas) [![Instagram](https://img.shields.io/badge/-Instagram-E4405F?style=flat-square\u0026logoColor=white\u0026link=https://www.instagram.com/thiago.tjas/)](https://www.instagram.com/thiago.tjas/) [![Website](https://img.shields.io/badge/-Website-888888?style=flat-square\u0026logoColor=white\u0026link=http://thiago-tjas.com/)](http://thiago-tjas.com/) [![GitHub](https://img.shields.io/badge/-GitHub-555555?style=flat-square\u0026logoColor=white\u0026link=https://github.com/tjas)](https://github.com/tjas)\n\n## Licence\n\n* Code distributed under [MIT License](https://github.com/tjas/tjas-aluratube/blob/master/LICENCE).\n\n\u003c!-- ## Acknowledgements\n\n- **Mario Souto** ⁘ [LinkedIn](https://www.linkedin.com/in/omariosouto/) ⁘ [YouTube](https://www.youtube.com/c/DevSoutinho) ⁘ [Twitter](https://twitter.com/omariosouto) ⁘ [Instagram](https://www.instagram.com/devsoutinho/) ⁘ [GitHub](https://github.com/omariosouto) ⁘ [GitHub Stars](https://stars.github.com/profiles/omariosouto/)\n\n    Instructor at Alura's React Immersion, for sharing his knowledge at React Immersion.\n\n- **Nayanne Lopes** ⁘ [LinkedIn](https://www.linkedin.com/in/nayannebatista/) ⁘ [Instagram](https://www.instagram.com/nayanne.tech/) ⁘ [GitHub](https://github.com/nayannebatista/)\n\n    Instructor at Alura, for contributing at React Immersion comparing React to Angular.\n\n- **Paulo Silveira** ⁘ [LinkedIn](https://www.linkedin.com/in/paulosilveira/) ⁘ [Instagram](https://www.instagram.com/paulo_hipster/) ⁘ [GitHub](https://github.com/peas)\n\n    Co-founder and CEO at Alura, for idealizing and creating the React Immersion. --\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftjas%2Ftjas-aluratube","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftjas%2Ftjas-aluratube","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftjas%2Ftjas-aluratube/lists"}