https://github.com/leiberbertel/leiber-bertel-web
This is my personal website, where you can get to know me better. It was initially coded with HTML5, CSS3, and pure JS. It has now been migrated to Angular 19, and the static files are located in Vercel Blob.
https://github.com/leiberbertel/leiber-bertel-web
angular cdn css3 html5 javascript
Last synced: 2 months ago
JSON representation
This is my personal website, where you can get to know me better. It was initially coded with HTML5, CSS3, and pure JS. It has now been migrated to Angular 19, and the static files are located in Vercel Blob.
- Host: GitHub
- URL: https://github.com/leiberbertel/leiber-bertel-web
- Owner: leiberbertel
- Created: 2023-01-23T16:08:53.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2026-01-12T23:19:23.000Z (5 months ago)
- Last Synced: 2026-01-23T12:41:42.471Z (5 months ago)
- Topics: angular, cdn, css3, html5, javascript
- Language: TypeScript
- Homepage: https://leiber-bertel-web.vercel.app/
- Size: 2.17 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Leiber Bertel | Portfolio
Personal portfolio migrated from plain HTML/CSS/JS to Angular 19 with standalone components. Includes translations, dark mode, carousels, and a functional contact form.
## Requirements
- Node.js 20+ and npm
- Angular CLI 19 (optionally install globally with `npm i -g @angular/cli`)
## Getting Started
1. cd leiber-bertel-web
2. npm install
3. npm start
4. Open http://localhost:4200
## Available Scripts
- npm start: starts the development environment with hot reload.
- npm run build: generates the production build in `dist/`.
- npm test: runs Angular unit tests.
- npm run watch: incremental build for development.
## Key Features
- Responsive navigation with hamburger menu, scroll shadow, and back-to-top button.
- Language selector (es/en/pt) and light/dark theme persistent in localStorage, managed by `src/app/core/services/i18n.service.ts`.
- Content sections: hero, about, skills (accordion), qualification (timeline), services, testimonials, portfolio, and contact.
- Native projects carousel in `src/app/features/portfolio/portfolio.component.ts` (arrows, pagination, and loop).
- Reactive contact form with validations, submission via Formspree (`https://formspree.io/f/mzbqzaad`), and alerts with SweetAlert2.
- Static resources in `public/assets` (images, PDF CV, and translations in `public/assets/i18n/*.json`).
## Structure
- `src/app/app.component.ts`: entry point that orchestrates data, theme, and language, and passes props to each section.
- `src/app/features/*`: standalone components per section (nav, hero, about, skills, qualification, services, testimonials, portfolio, contact, footer).
- `src/styles.css`: global styles and design tokens.
- `public/assets`: images, documents, and translation files.
## Deployment Notes
- The production output is located in `leiber-bertel-web/dist/` after running `npm run build`.
- If you add or change text, update the four translations in `public/assets/i18n/`.