mirror of
				https://github.com/kevinveenbirkenbach/homepage.veen.world.git
				synced 2025-11-04 09:27:58 +00:00 
			
		
		
		
	Compare commits
	
		
			7 Commits
		
	
	
		
			e18566d801
			...
			5f2e7ef696
		
	
	| Author | SHA1 | Date | |
|---|---|---|---|
| 5f2e7ef696 | |||
| 152a85bfb8 | |||
| fdfe301868 | |||
| cbfe1ed8ae | |||
| 9470162236 | |||
| 6a57fa1e00 | |||
| ab67fc0b29 | 
							
								
								
									
										155
									
								
								README.md
									
									
									
									
									
								
							
							
						
						
									
										155
									
								
								README.md
									
									
									
									
									
								
							@@ -1,86 +1,98 @@
 | 
			
		||||
# Portfolio CMS: Flask-based Portfolio Management 🚀
 | 
			
		||||
# PortUI 🖥️✨
 | 
			
		||||
 | 
			
		||||
[](https://github.com/sponsors/kevinveenbirkenbach) [](https://www.patreon.com/c/kevinveenbirkenbach) [](https://buymeacoffee.com/kevinveenbirkenbach) [](https://s.veen.world/paypaldonate)
 | 
			
		||||
[](https://github.com/sponsors/kevinveenbirkenbach)  
 | 
			
		||||
[](https://www.patreon.com/c/kevinveenbirkenbach)  
 | 
			
		||||
[](https://buymeacoffee.com/kevinveenbirkenbach)  
 | 
			
		||||
[](https://s.veen.world/paypaldonate)
 | 
			
		||||
 | 
			
		||||
This software allows individuals and institutions to set up an easy portfolio/landingpage/homepage to showcase their projects and online presence. It is highly customizable via a YAML configuration file.
 | 
			
		||||
A lightweight, Docker-powered portfolio/landing-page generator—fully customizable via YAML! Showcase your projects, skills, and online presence in minutes.  
 | 
			
		||||
 | 
			
		||||
## Features ✨
 | 
			
		||||
> 🚀 You can also pair PortUI with JavaScript for sleek, web-based desktop-style interfaces.  
 | 
			
		||||
> 💻 Example in action: [CyMaIS.Cloud](https://cymais.cloud/) (demo)  
 | 
			
		||||
> 🌐 Another live example: [veen.world](https://www.veen.world/) (Kevin’s personal site)
 | 
			
		||||
 | 
			
		||||
- **Dynamic Navigation:** Easily create dropdown menus and nested links.
 | 
			
		||||
- **Customizable Cards:** Showcase your skills, projects, or services.
 | 
			
		||||
- **Cache Management:** Optimize your assets with automatic caching.
 | 
			
		||||
- **Responsive Design:** Beautiful on any device with Bootstrap.
 | 
			
		||||
- **Easy Configuration:** Update content using a YAML file.
 | 
			
		||||
- **Command Line Interface:** Manage Docker containers with the `portfolio` CLI.
 | 
			
		||||
---
 | 
			
		||||
 | 
			
		||||
## Access 🌐
 | 
			
		||||
## ✨ Key Features
 | 
			
		||||
 | 
			
		||||
### Local Access
 | 
			
		||||
Access the application locally at [http://127.0.0.1:5000](http://127.0.0.1:5000).
 | 
			
		||||
- **Dynamic Navigation**  
 | 
			
		||||
  Create dropdowns & nested menus with ease.  
 | 
			
		||||
- **Customizable Cards**  
 | 
			
		||||
  Highlight skills, projects, or services—with icons, titles, and links.  
 | 
			
		||||
- **Smart Cache Management**  
 | 
			
		||||
  Auto-cache assets for lightning-fast loading.  
 | 
			
		||||
- **Responsive Design**  
 | 
			
		||||
  Built on Bootstrap; looks great on desktop, tablet & mobile.  
 | 
			
		||||
- **YAML-Driven**  
 | 
			
		||||
  All content & structure defined in a simple `config.yaml`.  
 | 
			
		||||
- **CLI Control**  
 | 
			
		||||
  Manage Docker containers via the `portfolio` command.
 | 
			
		||||
 | 
			
		||||
## Getting Started 🏁
 | 
			
		||||
---
 | 
			
		||||
 | 
			
		||||
### Prerequisites 📋
 | 
			
		||||
## 🌐 Quick Access
 | 
			
		||||
 | 
			
		||||
- Docker and Docker Compose installed on your system.
 | 
			
		||||
- Basic knowledge of Python and YAML for configuration.
 | 
			
		||||
- **Local Preview:**  
 | 
			
		||||
  [http://127.0.0.1:5000](http://127.0.0.1:5000)
 | 
			
		||||
 | 
			
		||||
### Installation 🛠️
 | 
			
		||||
---
 | 
			
		||||
 | 
			
		||||
#### Installation via git clone
 | 
			
		||||
## 🏁 Getting Started
 | 
			
		||||
 | 
			
		||||
1. **Clone the repository:**
 | 
			
		||||
### 🔧 Prerequisites
 | 
			
		||||
 | 
			
		||||
- Docker & Docker Compose  
 | 
			
		||||
- Basic Python & YAML knowledge  
 | 
			
		||||
 | 
			
		||||
### 🛠️ Installation via Git
 | 
			
		||||
 | 
			
		||||
1. **Clone & enter repo**  
 | 
			
		||||
   ```bash
 | 
			
		||||
   git clone <repository_url>
 | 
			
		||||
   cd <repository_directory>
 | 
			
		||||
   ```
 | 
			
		||||
 | 
			
		||||
2. **Update the configuration:**
 | 
			
		||||
   Create a `config.yaml` file. You can use `config.sample.yaml` as an example (see below for details on the configuration).
 | 
			
		||||
2. **Configure**
 | 
			
		||||
   Copy `config.sample.yaml` → `config.yaml` & customize.
 | 
			
		||||
3. **Build & run**
 | 
			
		||||
 | 
			
		||||
3. **Build and run the Docker container:**
 | 
			
		||||
   ```bash
 | 
			
		||||
   docker-compose up --build
 | 
			
		||||
   ```
 | 
			
		||||
4. **Browse**
 | 
			
		||||
   Open [http://localhost:5000](http://localhost:5000)
 | 
			
		||||
 | 
			
		||||
4. **Access your portfolio:**  
 | 
			
		||||
   Open your browser and navigate to [http://localhost:5000](http://localhost:5000).
 | 
			
		||||
 | 
			
		||||
### Installation via Kevin's Package Manager
 | 
			
		||||
 | 
			
		||||
You can install the `portfolio` CLI using [Kevin's package manager](https://github.com/kevinveenbirkenbach/package-manager). Simply run:
 | 
			
		||||
### 📦 Installation via Kevin’s Package Manager
 | 
			
		||||
 | 
			
		||||
```bash
 | 
			
		||||
pkgmgr install portfolio
 | 
			
		||||
pkgmgr install portui
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
This will install the CLI tool, making it available system-wide.
 | 
			
		||||
Once installed, the `portui` CLI is available system-wide.
 | 
			
		||||
 | 
			
		||||
### Available Commands
 | 
			
		||||
---
 | 
			
		||||
 | 
			
		||||
After installation, you can access the help information for the CLI by running:
 | 
			
		||||
## 🖥️ CLI Commands
 | 
			
		||||
 | 
			
		||||
```bash
 | 
			
		||||
portfolio --help
 | 
			
		||||
portui --help
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
This command displays detailed instructions on how to use the following commands:
 | 
			
		||||
* `build` Build the Docker image
 | 
			
		||||
* `up` Start containers (with build)
 | 
			
		||||
* `down` Stop & remove containers
 | 
			
		||||
* `run-dev` Dev mode (hot-reload)
 | 
			
		||||
* `run-prod` Production mode
 | 
			
		||||
* `logs` View container logs
 | 
			
		||||
* `dev` Docker-Compose dev environment
 | 
			
		||||
* `prod` Docker-Compose prod environment
 | 
			
		||||
* `cleanup` Prune stopped containers
 | 
			
		||||
 | 
			
		||||
- **build:** Build the Docker image for the portfolio application.
 | 
			
		||||
- **up:** Start the application using docker-compose (with build).
 | 
			
		||||
- **down:** Stop and remove the Docker container.
 | 
			
		||||
- **run-dev:** Run the container in development mode with hot-reloading.
 | 
			
		||||
- **run-prod:** Run the container in production mode.
 | 
			
		||||
- **logs:** Display the logs of the running container.
 | 
			
		||||
- **dev:** Start the application in development mode using docker-compose.
 | 
			
		||||
- **prod:** Start the application in production mode using docker-compose.
 | 
			
		||||
- **cleanup:** Remove all stopped Docker containers to clean up your Docker environment.
 | 
			
		||||
---
 | 
			
		||||
 | 
			
		||||
## YAML Configuration Guide 🔧
 | 
			
		||||
## 🔧 YAML Configuration Guide
 | 
			
		||||
 | 
			
		||||
The portfolio is powered by a YAML configuration file (`config.yaml`). This file allows you to define the structure and content of your site, including cards, navigation, and company details.
 | 
			
		||||
 | 
			
		||||
### YAML Configuration Example 📄
 | 
			
		||||
Define your site’s structure in `config.yaml`:
 | 
			
		||||
 | 
			
		||||
```yaml
 | 
			
		||||
accounts:
 | 
			
		||||
@@ -94,17 +106,12 @@ accounts:
 | 
			
		||||
      icon:
 | 
			
		||||
        class: fas fa-newspaper
 | 
			
		||||
      children:
 | 
			
		||||
        - name: Microblogs
 | 
			
		||||
          description: Stay updated with my microblog posts.
 | 
			
		||||
        - name: Mastodon
 | 
			
		||||
          description: Follow me on Mastodon.
 | 
			
		||||
          icon:
 | 
			
		||||
            class: fa-solid fa-pen-nib
 | 
			
		||||
          children:
 | 
			
		||||
            - name: Mastodon
 | 
			
		||||
              description: Follow my updates on Mastodon.
 | 
			
		||||
              icon:
 | 
			
		||||
                class: fa-brands fa-mastodon
 | 
			
		||||
              url: https://microblog.veen.world/@kevinveenbirkenbach
 | 
			
		||||
              identifier: "@kevinveenbirkenbach@microblog.veen.world"
 | 
			
		||||
            class: fa-brands fa-mastodon
 | 
			
		||||
          url: https://microblog.veen.world/@kevinveenbirkenbach
 | 
			
		||||
          identifier: "@kevinveenbirkenbach@microblog.veen.world"
 | 
			
		||||
  cards:
 | 
			
		||||
    - icon:
 | 
			
		||||
        source: https://cloud.veen.world/s/logo_agile_coach_512x512/download
 | 
			
		||||
@@ -112,9 +119,10 @@ accounts:
 | 
			
		||||
      text: I lead agile transformations and improve team dynamics through Scrum and Agile Coaching.
 | 
			
		||||
      url: https://www.agile-coach.world
 | 
			
		||||
      link_text: www.agile-coach.world
 | 
			
		||||
 | 
			
		||||
company:
 | 
			
		||||
  titel: Kevin Veen-Birkenbach
 | 
			
		||||
  subtitel: Consulting and Coaching Solutions
 | 
			
		||||
  title: Kevin Veen-Birkenbach
 | 
			
		||||
  subtitle: Consulting & Coaching Solutions
 | 
			
		||||
  logo:
 | 
			
		||||
    source: https://cloud.veen.world/s/logo_face_512x512/download
 | 
			
		||||
  favicon:
 | 
			
		||||
@@ -127,26 +135,27 @@ company:
 | 
			
		||||
  imprint_url: https://s.veen.world/imprint
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
### Understanding the `children` Key 🔍
 | 
			
		||||
* **`children`** enables multi-level menus.
 | 
			
		||||
* **`link`** references other YAML paths to avoid duplication.
 | 
			
		||||
 | 
			
		||||
The `children` key allows hierarchical nesting of elements. Each child can itself have children, enabling the creation of multi-level navigation menus or grouped content.
 | 
			
		||||
---
 | 
			
		||||
 | 
			
		||||
### Understanding the `link` Key 🔗
 | 
			
		||||
## 🚢 Production Deployment
 | 
			
		||||
 | 
			
		||||
The `link` key allows you to reference another part of the YAML configuration by its path, which helps avoid duplication and maintain consistency.
 | 
			
		||||
* Use a reverse proxy (NGINX/Apache).
 | 
			
		||||
* Secure with SSL/TLS.
 | 
			
		||||
* Swap to a production database if needed.
 | 
			
		||||
 | 
			
		||||
## Deployment 🚢
 | 
			
		||||
---
 | 
			
		||||
 | 
			
		||||
For production deployment, ensure to:
 | 
			
		||||
## 📜 License
 | 
			
		||||
 | 
			
		||||
- Use a reverse proxy like NGINX or Apache.
 | 
			
		||||
- Secure your site with SSL/TLS.
 | 
			
		||||
- Use a production-ready database if required.
 | 
			
		||||
Licensed under **GNU AGPLv3**. See [LICENSE](./LICENSE) for details.
 | 
			
		||||
 | 
			
		||||
## License 📜
 | 
			
		||||
---
 | 
			
		||||
 | 
			
		||||
This project is licensed under the GNU Affero General Public License Version 3. See the [LICENSE](./LICENSE) file for details.
 | 
			
		||||
## ✍️ Author
 | 
			
		||||
 | 
			
		||||
## Author ✍️
 | 
			
		||||
Created by [Kevin Veen-Birkenbach](https://www.veen.world/)
 | 
			
		||||
 | 
			
		||||
This software was created by [Kevin Veen-Birkenbach](https://www.veen.world/).
 | 
			
		||||
Enjoy building your portfolio! 🌟
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user