{"id":17897210,"url":"https://github.com/pkg-dot-zip/kobwebportfoliotemplate","last_synced_at":"2025-03-23T06:31:07.063Z","repository":{"id":219637605,"uuid":"749391246","full_name":"pkg-dot-zip/KobwebPortfolioTemplate","owner":"pkg-dot-zip","description":"An auto-updating content portfolio template made in Kotlin using Kobweb using the GitHub API!","archived":false,"fork":false,"pushed_at":"2025-03-13T16:44:39.000Z","size":11214,"stargazers_count":12,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-13T17:51:17.762Z","etag":null,"topics":["compose","github-api","kobweb","kotlin","kotlin-js","portfolio","portfolio-template","template"],"latest_commit_sha":null,"homepage":"http://www.pkg-dot-zip.com/","language":"Kotlin","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/pkg-dot-zip.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"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}},"created_at":"2024-01-28T13:01:54.000Z","updated_at":"2025-03-13T16:44:42.000Z","dependencies_parsed_at":"2024-02-07T14:48:41.418Z","dependency_job_id":"0d163f4f-05f3-4753-baf2-e8b7d2d00ee2","html_url":"https://github.com/pkg-dot-zip/KobwebPortfolioTemplate","commit_stats":null,"previous_names":["pkg-dot-zip/kobwebportfoliotemplate"],"tags_count":0,"template":true,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pkg-dot-zip%2FKobwebPortfolioTemplate","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pkg-dot-zip%2FKobwebPortfolioTemplate/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pkg-dot-zip%2FKobwebPortfolioTemplate/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pkg-dot-zip%2FKobwebPortfolioTemplate/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/pkg-dot-zip","download_url":"https://codeload.github.com/pkg-dot-zip/KobwebPortfolioTemplate/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245066496,"owners_count":20555402,"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":["compose","github-api","kobweb","kotlin","kotlin-js","portfolio","portfolio-template","template"],"created_at":"2024-10-28T15:08:07.234Z","updated_at":"2025-03-23T06:31:07.048Z","avatar_url":"https://github.com/pkg-dot-zip.png","language":"Kotlin","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003ch3 align=\"center\"\u003eKotweb Portfolio Template\u003c/h3\u003e\n\n\u003cdiv align=\"center\"\u003e\n\n![](docs/image/photo-collage.png.png)\n\n  [![Stars](https://img.shields.io/github/stars/pkg-dot-zip/KobwebPortfolioTemplate.svg)](https://github.com/pkg-dot-zip/KobwebPortfolioTemplate/stargazers)\n  [![GitHub Issues](https://img.shields.io/github/issues/pkg-dot-zip/KobwebPortfolioTemplate.svg)](https://github.com/pkg-dot-zip/KobwebPortfolioTemplate/issues)\n  [![GitHub Pull Requests](https://img.shields.io/github/issues-pr/pkg-dot-zip/KobwebPortfolioTemplate.svg)](https://github.com/pkg-dot-zip/KobwebPortfolioTemplate/pulls)\n\n\u003c/div\u003e\n\n\u003cp align=\"center\"\u003eAn auto-updating content portfolio template made in \u003ca href=\"https://kotlinlang.org/\"\u003eKotlin\u003c/a\u003e using \u003ca href=\"https://kobweb.varabyte.com/\"\u003eKobweb\u003c/a\u003e!\n\u003c/p\u003e\n\u003cp align=\"center\"\u003eClick \u003ca href=\"https://www.pkg-dot-zip.com/\"\u003ehere\u003c/a\u003e for an example built with the template.\n\u003c/p\u003e\n\n## 📝 Table of Contents\n- [About](#about)\n- [Example](#example)\n- [TODO](#todo)\n- [Usage](#usage)\n- [Built Using](#built_using)\n- [Authors](#authors)\n\n## 🧐 About \u003ca name = \"about\"\u003e\u003c/a\u003e\nThis repository template contains a ready-to-go website built in Kotlin for you to use. \n\n### What does it do? 🤔\nThe project retrieves the repositories from your GitHub account url to create a simple overview site that is automatically updated. This way you don't have to add a new project to your website if you create a new repository using your GitHub account. **Deploy once, never update again.**\n\n### Why?! 😱\nI am someone that doesn't only create big projects, but also a lot of smaller ones. I don't want to have to update my website every week. Who has the time for that?\n\nThis solution simply **saves** a lot of **time**.\n\n### Features 🌟\n- An automatically updated site.\n- Animated video background.\n- An About page that is generated from your markdown file (and you can add more pages using markdown and Kotlin!).\n- A 'special date' system that lets you configure what images and text to display on the front page!\n- A custom \"logger\" class to better handle console output.\n- CSS effects on hover of images.\n\n## 🌐 Example \u003ca name = \"example\"\u003e\u003c/a\u003e\nYou can look at a live version of a website that used this template [here](https://pkg-dot-zip.com/).\n\n### Index Page Example\n\u003cdetails\u003e\n\u003csummary\u003e\nIndex Page Example\n\u003c/summary\u003e\n\n![](docs/image/index.png)\n\u003c/details\u003e\n\n### About Page Example\n\u003cdetails\u003e\n\u003csummary\u003e\nAbout Page Example\n\u003c/summary\u003e\n\n![](docs/image/about.png)\n\u003c/details\u003e\n\n### Repositories Page Example\n\u003cdetails\u003e\n\u003csummary\u003e\nRepositories Page Example\n\u003c/summary\u003e\n\n![](docs/image/repositories.png)\n\u003c/details\u003e\n\n## 🛠️ TODO \u003ca name = \"todo\"\u003e\u003c/a\u003e\n- If you have any suggestions, feel free to [create an issue](https://github.com/pkg-dot-zip/KobwebPortfolioTemplate/issues/new). Make sure to add the '_enhancement_' label. 😉\n## 🎈 Usage \u003ca name=\"usage\"\u003e\u003c/a\u003e\n### Retrieving the project\n#### Method 1: (**Recommended**)\n1. Open the terminal in an empty directory where you want to clone this template to.\n1. Open your terminal and run the following command:\n```bash\nkobweb create --repo https://github.com/pkg-dot-zip/KobwebPortfolioTemplate\n```\nThen follow the instructions in your terminal.\n\n#### Method 2:\n1. Go to the [project page on GitHub](https://github.com/pkg-dot-zip/KobwebPortfolioTemplate).\n1. Click on the green button displaying the text \"Use this template\" and follow the instructions.\n1. Clone your newly crafted repository and start working on the site.\n\n### Getting started\n1. Open the project in [IntelliJ](https://www.jetbrains.com/idea/) (or navigate to project folder in cmd).\n1. Open the Terminal tab at the bottom of your screen.\n1. Type the following:\n\n```bash\ncd site\nkobweb run\n```\n4. Open [http://localhost:8080](http://localhost:8080) with your browser to see the result. This is a live view of your website; any time you make adjustments, the site will rebuild and you can view the results here.\n*Note*: You can configure the port in *site/.kobweb/conf.yaml*.\n\n### Exporting the site\n1. Open up your terminal in the *site* folder again. If you are still in IntelliJ running the site, press Q in the terminal to stop it.\n1. Then export the project using:\n\n```bash\nkobweb export --layout static\n```\n\n### Tips \u0026 Tricks\n#### Markdown Support\nKobweb markdown support is enabled, which is used by default for the About page. This means that when you drag your markdown files into the markdown folder in your resources, it'll generate a page for each one of them. For a better explanation check [here](https://github.com/varabyte/kobweb?tab=readme-ov-file#markdown).\n\n#### Chrome Extensions\nIf you want to create your own pages, or change the layout, these Chrome Extensions are recommended to speed up development.\n\n| Name | Description |\n| ---- | ----------- |\n| [Layout Debugger](https://chromewebstore.google.com/detail/layout-debugger/gkamnoiedmidgolhlihkamjpfccohilb) | Chrome extension for highlighting DOM elements to better debug layout issues |\n| [Response Viewer](https://chromewebstore.google.com/detail/responsive-viewer/inmopeiepgfljkpkidclfgbgbmfcennb) | Show multiple screens once, Responsive design tester |\n| [GoFullPage](https://chromewebstore.google.com/detail/gofullpage-full-page-scre/fdpohaocaechififmbbbbbknoalclacl) | Capture a screenshot of your current page in entirety and reliably—without requesting any extra permissions! |\n\n## ⛏️ Built Using \u003ca name = \"built_using\"\u003e\u003c/a\u003e\n- [IntelliJ](https://www.jetbrains.com/idea/) - IDE used\n- [Kotlin](https://kotlinlang.org/) - Language used to program in\n- [Kobweb](https://kobweb.varabyte.com/) - Framework built on top of Compose HTML\n- [kotlinx.serialization](https://github.com/Kotlin/kotlinx.serialization) -\nKotlin multiplatform / multi-format serialization used for JSON deserialization\n- [GitHub REST API](https://docs.github.com/en/rest) - Used to retrieve data from GitHub\n- [Animated Fluent Emojis](https://animated-fluent-emoji.vercel.app/) - Used for all the animated emojis you see on the site\n- [GitHub Socialify](https://socialify.git.ci/) - Effortlessly create social images for GitHub projects to share with the world. \n- [MyOctocat](https://myoctocat.com/) - Used to generate the Octocat on the repositories page\n\n## ✍️ Authors \u003ca name = \"authors\"\u003e\u003c/a\u003e\n- [@pkg-dot-zip](https://github.com/pkg-dot-zip) - Idea \u0026 Initial work.\n\nSee also the list of [contributors](https://github.com/pkg-dot-zip/KobwebPortfolioTemplate/contributors) who participated in this project.\n\n---\n\nI found out about Kobweb due to [this LinkedIn post](https://www.linkedin.com/feed/update/urn:li:activity:7150703760011366400?utm_source=share\u0026utm_medium=member_desktop), in which Binay Shaw showcased his [Kotfolio](https://github.com/binayshaw7777/Kotfolio) project. So special thanks to him. 😁 \n\nAnd lastly thanks to the entire Kobweb community, whom assisted me by taking their time to answer my questions in their [Discord server](https://discord.gg/9F4Q6r42j2). 🙏","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpkg-dot-zip%2Fkobwebportfoliotemplate","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpkg-dot-zip%2Fkobwebportfoliotemplate","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpkg-dot-zip%2Fkobwebportfoliotemplate/lists"}