{"id":20314159,"url":"https://github.com/samuel-ricardo/treedfolio","last_synced_at":"2025-07-02T22:33:18.096Z","repository":{"id":213966999,"uuid":"735367605","full_name":"Samuel-Ricardo/TreeDFolio","owner":"Samuel-Ricardo","description":"A 3D Portifolio template","archived":false,"fork":false,"pushed_at":"2024-03-14T19:13:14.000Z","size":26792,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-03-04T08:44:45.418Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://tree-d-folio.vercel.app","language":"TypeScript","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/Samuel-Ricardo.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","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}},"created_at":"2023-12-24T16:53:28.000Z","updated_at":"2023-12-27T22:15:03.000Z","dependencies_parsed_at":"2024-03-14T20:40:59.144Z","dependency_job_id":null,"html_url":"https://github.com/Samuel-Ricardo/TreeDFolio","commit_stats":null,"previous_names":["samuel-ricardo/treedfolio"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Samuel-Ricardo/TreeDFolio","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Samuel-Ricardo%2FTreeDFolio","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Samuel-Ricardo%2FTreeDFolio/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Samuel-Ricardo%2FTreeDFolio/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Samuel-Ricardo%2FTreeDFolio/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Samuel-Ricardo","download_url":"https://codeload.github.com/Samuel-Ricardo/TreeDFolio/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Samuel-Ricardo%2FTreeDFolio/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":263226887,"owners_count":23433801,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":[],"created_at":"2024-11-14T18:14:12.463Z","updated_at":"2025-07-02T22:33:18.056Z","avatar_url":"https://github.com/Samuel-Ricardo.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# TreeDFolio\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://fullcycle.com.br/\" target=\"_blank\"\u003e\n    \u003cimg width=\"auto\" src=\"./readme_assets/preview.png\"/\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n\u003ch4 align=\"center\" \u003e🚀 🟪 TreeDFolio 🟪 🚀\u003c/h4\u003e\n\n\u003ch4 align=\"center\"\u003e\n  This application is a conclusion of my study about 3d Rendering and animations with NextJS\n\u003c/h4\u003e\n\n#\n\n\u003cp align=\"center\"\u003e\n  |\u0026nbsp;\u0026nbsp;\n  \u003ca style=\"color: #8a4af3;\" href=\"#project\"\u003eOverview\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u0026nbsp;|\u0026nbsp;\u0026nbsp;\u0026nbsp;\n  \u003ca style=\"color: #8a4af3;\" href=\"#techs\"\u003eTechnologies\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u0026nbsp;|\u0026nbsp;\u0026nbsp;\u0026nbsp;\n  \u003ca style=\"color: #8a4af3;\" href=\"#app\"\u003eProject\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u0026nbsp;|\u0026nbsp;\u0026nbsp;\n  \u003ca style=\"color: #8a4af3;\" href=\"#run-project\"\u003eRun\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u0026nbsp;|\u0026nbsp;\u0026nbsp;\n  \u003ca style=\"color: #8a4af3;\" href=\"#author\"\u003eAuthor\u003c/a\u003e\u0026nbsp;\u0026nbsp;\u0026nbsp;|\u0026nbsp;\u0026nbsp;\u0026nbsp;\n\u003c/p\u003e\n\n#\n\n\u003ch1 align=\"center\"\u003e\n  \n  \u003ca href=\"https://github.com/Samuel-Ricardo\"\u003e\n    \u003cimg src=\"https://img.shields.io/static/v1?label=\u0026message=Samuel%20Ricardo\u0026color=black\u0026style=for-the-badge\u0026logo=GITHUB\"/\u003e\n  \u003c/a\u003e\n\n  \u003ca herf=\"https://www.instagram.com/samuel_ricardo.ex/\"\u003e\n    \u003cimg src='https://img.shields.io/static/v1?label=\u0026message=Samuel.ex\u0026color=black\u0026style=for-the-badge\u0026logo=instagram'/\u003e \n  \u003c/a\u003e\n\n  \u003ca herf='https://www.linkedin.com/in/samuel-ricardo/'\u003e\n    \u003cimg src='https://img.shields.io/static/v1?label=\u0026message=Samuel%20Ricardo\u0026color=black\u0026style=for-the-badge\u0026logo=LinkedIn'/\u003e \n  \u003c/a\u003e\n\n\u003c/h1\u003e\n\n\u003cbr\u003e\n\n\u003cp id=\"project\"/\u003e\n\n\u003cbr\u003e\n\n\u003ch2\u003e  | :artificial_satellite: About:  \u003c/h2\u003e\n\n\u003cp align=\"justify\"\u003e\nIn this project, the target is to build a website that explore the real time 3D Rendering and 3D Effects using NextJS and improve all tech skills related to website animations.\n\u003c/p\u003e\n\n\u003cp align=\"justify\"\u003e\nFor this, i build a Dev Portfolio website, that you can use as a template, because i can apply all features and visual designs and animations that i have in mind.\n\u003c/p\u003e\n\n\u003cbr\u003e\n\n📡 | Hosted on Vercel: [ https://tree-d-folio.vercel.app/ ]\n\n\u003cbr\u003e\n\n#\n\n\u003cbr\u003e\n\n\u003ch2 id=\"techs\"\u003e\n  :building_construction: | Technologies and Concepts Studied:\n\u003c/h2\u003e\n\n\u003e \u003ca href='https://nextjs.org/'\u003e \u003cimg width=\"64px\" src=\"https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/nextjs/nextjs-original.svg\" /\u003e \u003c/a\u003e\n\n- Three\n- NextJS\n- TailwindCSS\n- Typescript\n- Docker\n- EmailJS\n- Framer Motion\n- eslint\n- Prettier\n- husky\n- lint-staged\n\n\u003e Among Others...\n\n#\n\n\u003cbr\u003e\n\n\u003ch2 id=\"app\"\u003e\n  💻 | Application:\n\u003c/h2\u003e\n\n\u003cp align=\"justify\"\u003e\nThis Portfolio show the highlights of a developer, social media, and some projects with a call to action in the end of the page. Parallax, drawn, fade in, are some of animations here. This project have a module system with email sending, form validations and more.\n\u003c/p\u003e\n\n\u003cbr\u003e\n\n\u003cvideo width=\"100%\" controls\u003e\n  \u003csource src=\"./readme_assets/demo.mp4\" type=\"video/mp4\"\u003e\n\u003c/video\u003e\n\n\u003cbr\u003e\n\u003cbr\u003e\n\n\u003cp align=\"justify\"\u003e\n*Remember this software runs on free machines, that is, with the minimum of resources to fit into free plans, so with scarce resources in the production environment these were the results I obtained\n\u003c/p\u003e\n\n\u003cbr/\u003e\n\n \u003cimg width=\"auto\" src=\"https://media.discordapp.net/attachments/852529276083503134/1189694407486754827/image.png?ex=66049bc2\u0026is=65f226c2\u0026hm=808f4780f04de940267e8c9353f4c7befd799c672d22c7b57403c82c920f8e5d\u0026=\u0026format=webp\u0026quality=lossless\u0026width=1202\u0026height=676\"/\u003e\n\n\u003cbr\u003e\n\n  \u003cp\u003e\n    Loading 3D models can be difficult for the browser, but once loaded, the site runs smoothly\n  \u003c/p\u003e\n\n\u003cbr\u003e\n\u003cbr\u003e\n\n📡 | Hosted on Vercel: [ https://tree-d-folio.vercel.app/ ]\n\n\u003cbr\u003e\n\u003cbr\u003e\n\n\u003ch2 id=\"run-project\"\u003e \n   👨‍💻 | How to use\n\u003c/h2\u003e\n\n\u003cbr\u003e\n\n### Open your Git Terminal and clone this repository\n\n```git\n  $ git clone \"git@github.com:Samuel-Ricardo/TreeDFolio.git\"\n```\n\n### Make Pull\n\n```git\n  $ git pull \"git@github.com:Samuel-Ricardo/TreeDFolio.git\"\n```\n\n\u003cbr\u003e\n\nThis application use `Docker` so you dont need to install and cofigurate anything other than docker on your machine.\n\n\u003e \u003ca target=\"_blank\" href=\"https://www.docker.com/\"\u003e \u003cimg width=\"48px\" src=\"https://cdn.jsdelivr.net/gh/devicons/devicon/icons/docker/docker-plain-wordmark.svg\" /\u003e \u003c/a\u003e\n\n\u003cbr\u003e\n\nNavigate to project folder `$ cd ./treedfolio/` and run it using `docker-compose`\n\n```bash\n\n  # After setup docker environment just run this commmand on root project folder:\n\n  $ docker-compose up --build   # For First Time run this command\n\n  $ docker-compose up           # to run project\n\n\n```\n\n```bash\n\n  #Apps Running on:\n\n  $ APP: http://localhost:3000\n\n  See more: ./treedfolio/docker-compose.yaml\n\n```\n\n\u003cbr\u003e\n\n#\n\n\u003cbr\u003e\n\n\u003ch2 id=\"author\"\u003e\n  :octocat: | Author:  \n\u003c/h2\u003e\n\n\u003e \u003ca target=\"_blank\" href=\"https://www.linkedin.com/in/samuel-ricardo/\"\u003e \u003cimg width=\"350px\" src=\"https://github.com/Samuel-Ricardo/bolao-da-copa/blob/main/readme_files/IMG_20220904_220148_188.jpg?raw=true\"/\u003e \u003cbr\u003e \u003cp\u003e \u003cb\u003e - Samuel Ricardo\u003c/b\u003e \u003c/p\u003e\u003c/a\u003e\n\n\u003ch1\u003e\n  \u003ca herf='https://github.com/Samuel-Ricardo'\u003e\n    \u003cimg src='https://img.shields.io/static/v1?label=\u0026message=Samuel%20Ricardo\u0026color=black\u0026style=for-the-badge\u0026logo=GITHUB'\u003e \n  \u003c/a\u003e\n  \n  \u003ca herf='https://www.instagram.com/samuel_ricardo.ex/'\u003e\n    \u003cimg src='https://img.shields.io/static/v1?label=\u0026message=Samuel.ex\u0026color=black\u0026style=for-the-badge\u0026logo=instagram'\u003e \n  \u003c/a\u003e\n  \n  \u003ca herf='https://twitter.com/SamuelR84144340'\u003e\n    \u003cimg src='https://img.shields.io/static/v1?label=\u0026message=Samuel%20Ricardo\u0026color=black\u0026style=for-the-badge\u0026logo=twitter'\u003e \n  \u003c/a\u003e\n  \n   \u003ca herf='https://www.linkedin.com/in/samuel-ricardo/'\u003e\n    \u003cimg src='https://img.shields.io/static/v1?label=\u0026message=Samuel%20Ricardo\u0026color=black\u0026style=for-the-badge\u0026logo=LinkedIn'\u003e \n  \u003c/a\u003e\n\u003c/h1\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsamuel-ricardo%2Ftreedfolio","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsamuel-ricardo%2Ftreedfolio","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsamuel-ricardo%2Ftreedfolio/lists"}