sebastian2357 3d5d2fff0a
refactor(other): new website structure (#227)
* - added new site /new/README.md
- added new components
- added component registration "client.js"
- added approach for tailwind integration (does not work yet)

* Use TypeScript and script setup

* No ts for .textlintrc

* Make Tailwind work

* include heropage contents

partially fixes https://github.com/IT4Change/IT4C.dev/issues/221

* adjust contents of Services

Adjust contents according to
https://github.com/IT4Change/IT4C.dev/issues/222

* added Team & Values texts

According to https://github.com/IT4Change/IT4C.dev/issues/223

* fixed type

* fixed unreferenced styles/main.css

* sample from theme-hope-docu

From
https://theme-hope.vuejs.press/guide/layout/home.html#project-highlights-and-features

* - adapted Hope hero section
- removed remaining Hero Widgets
- added ContentSection
- optimized layout of team section

* - optimized layout/style of ContactForm

* - made TeamMember functional and added some transitions
- added new members as placeholder

* Hero at 100vh; transparent navbar on home page

* Add text and image for Max

* Keep logo text in same row as logo

* - added REST request to mail backend
- added limitations to contact fields

* - added photo and phone number to contact form

* - changed contact person and phone number

* - replaced hero section
- replaced default layout
- replaced footer

* clean up

* - optimized colors

* - clean up AI comments

* move new page from /new to /

* fixed errors with contactForm

* fix projects

* fix merge error

* corrected image for Sebastian

* - improved layout

* - fixed tag colors
- fixed phone number color and hover

---------

Co-authored-by: Sebastian Stein <git@codepassion.de>
Co-authored-by: Maximilian Harz <maxharz@gmail.com>
Co-authored-by: Ulf Gebhardt <ulf.gebhardt@webcraft-media.de>
Co-authored-by: Sebastian Stein <sebastian@codepassion.de>
2025-03-17 01:09:31 +01:00
2025-01-28 20:26:42 +01:00
2022-12-30 20:26:37 +01:00

IT4C.dev

This repository contains the Website utilizing vuepress to generate it.

Software requirements

This package requires:

On alpine you need to install the following software to get the vuepress-plugin-imagemin properly installed:

apk add autoconf libtool automake build-base nasm libpng-dev

Techstack

This package uses:

Usage

How to use this package

Build

Build the static files of the website which then can be found under docs/.vuepress/dist/.

npm run build

Dev

Bring up a development environment with hot reloading which can be reached under

npm run dev

Test

Run the tests to ensure everything is working as expected

npm test

Deploy

You can use the webhook template webhook.conf.template and the deploy.sh script in .github/webhooks/ for an automatic deployment from a (github) webhook.

For this to work follow these steps (using alpine):

apk add webhook
cp .github/webhooks/hooks.json.template .github/webhooks/hooks.json
vi .github/webhooks/hooks.json
# adjust content of .github/webhooks/hooks.json
# replace all variables accordingly

# copy webhook service file
cp .github/webhooks/webhook.template /etc/init.d/webhook
vi /etc/init.d/webhook
# adjust content of /etc/init.d/webhook
chmod +x /etc/init.d/webhook

service webhook start
rc-update add webhook boot

vi /etc/nginx/http.d/default.conf
# adjust the nginx config
# location /hooks/ {
#     proxy_http_version 1.1;
#     proxy_set_header   Upgrade $http_upgrade;
#     proxy_set_header   Connection 'upgrade';
#     proxy_set_header   X-Forwarded-For $remote_addr;
#     proxy_set_header   X-Real-IP  $remote_addr;
#     proxy_set_header   Host $host;
# 
#     proxy_pass         http://127.0.0.1:9000/hooks/;
#     proxy_redirect     off;
# 
#     #access_log $LOG_PATH/nginx-access.hooks.log hooks_log;
#     #error_log $LOG_PATH/nginx-error.backend.hook.log warn;
# }

# for the backend install pm2
npm install pm2 -g

# expose the backend service via nginx
vi /etc/nginx/http.d/default.conf
# location /api/ {
#     proxy_http_version 1.1;
#     proxy_set_header   Upgrade $http_upgrade;
#     proxy_set_header   Connection 'upgrade';
#     proxy_set_header   X-Forwarded-For $remote_addr;
#     proxy_set_header   X-Real-IP  $remote_addr;
#     proxy_set_header   Host $host;
#
#     proxy_pass         http://127.0.0.1:3000/;
#     proxy_redirect     off;
#
#     #access_log $LOG_PATH/nginx-access.api.log hooks_log;
#     #error_log $LOG_PATH/nginx-error.api.log warn;
# }

For the github webhook configure the following:

Field Value
Payload URL https://it4c.dev/hooks/github
Content type application/json
Secret A SECRET
SSL verification Enable SSL verification
Which events would you like to trigger this webhook? Send me everything.
Active [x]

How it works

This repository utilizes vuepress-deploy to automatically deploy the current master branch to github pages.

repo-architecture

A Pullrequest-Review-Workflow is applied to get changes into the master. From there on an automatic github workflow script utilizing vuepress-deploy is taking over. The vuepress page is built and force-pushed to the gh-pages branch, which in turn is then deployed on the github pages infrastructure and bound to the web address IT4C.dev.

Description
Languages
TypeScript 100%