Portfolio CMS: Flask-based Portfolio Management🚀

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.

Features ✨

• 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.

Access 🌐

Locale

Access the application locally at http://127.0.0.1:5000.

Getting Started 🏁

Prerequisites 📋

• Docker and Docker Compose installed on your system.
• Basic knowledge of Python and YAML for configuration.

Installation 🛠️

1. Clone the repository:

   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).

3. Build and run the Docker container:

   docker-compose up --build
   

4. Access your portfolio: Open your browser and navigate to http://localhost:5000.

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 📄

accounts:
  name: Online Accounts
  description: Discover my online presence.
  icon:
    class: fa-solid fa-users
  children:
    - name: Channels
      description: Platforms where I share content.
      icon:
        class: fas fa-newspaper
      children:
        - name: Microblogs
          description: Stay updated with my microblog posts.
          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"
  cards:
    - icon:
        source: https://cloud.veen.world/s/logo_agile_coach_512x512/download
      title: Agile Coach
      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
  logo:
    source: https://cloud.veen.world/s/logo_face_512x512/download
  favicon:
    source: https://cloud.veen.world/s/veen_world_favicon/download
  address:
    street: Afrikanische Straße 43
    postal_code: DE-13351
    city: Berlin
    country: Germany
  imprint_url: https://s.veen.world/imprint

Understanding the children Key 🔍

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. Example:

children:
  - name: Parent Item
    description: Parent description.
    icon:
      class: fa-solid fa-folder
    children:
      - name: Child Item
        description: Child description.
        icon:
          class: fa-solid fa-file
        url: https://example.com

This structure will render a parent menu or section containing nested child elements. Each child can be further customized with icons, descriptions, and links.

Understanding the link Key 🔗

The link key allows you to reference another part of the YAML configuration by its path. This is useful for avoiding duplication and maintaining consistency. Example:

children:
  - name: Blog
    description: My blog posts.
    icon:
      class: fa-solid fa-blog
    url: https://example.com/blog
  - name: Featured Blog
    link: accounts.children[0].children[0]  # References the "Blog" item above

In this example, Featured Blog will inherit all properties from the Blog item, including its name, description, and URL. This feature ensures that any updates to the Blog item are automatically reflected in all linked entries.

Administrate Docker 🐳

Stop and Destroy

docker stop portfolio; docker rm portfolio

Build

docker build -t application-portfolio .

Run

Run Development Environment

docker run -d -p 5000:5000 --name portfolio -v $(pwd)/app/:/app -e FLASK_APP=app.py -e FLASK_ENV=development application-portfolio

Run Production Environment

docker run -d -p 5000:5000 --name portfolio application-portfolio

Debug

docker logs -f portfolio

Development Mode 🧑‍💻

To run the app in development mode with hot-reloading:

FLASK_ENV=development docker-compose up

Deployment 🚢

For production deployment, ensure to:

• Use a reverse proxy like NGINX or Apache.
• Secure your site with SSL/TLS.
• Use a production-ready database if required.

Author ✍️

This software was created by Kevin Veen-Birkenbach.

License 📜

This project is licensed under the GNU Affero General Public License Version 3. See the LICENSE file for details.