Personal Site

screenshot of Personal Site
gatsby
nextjs
nuxt
react
vue
styled-components
chakra-ui

:metal: Personal site of Kevin Peters. PWA powered. Some mix of blog and portfolio which was written with Nuxt.js. Articles are about Vue.js and Clean Code. Also showcasing my projects on this website.

Overview

The personal-site project by igeligel is a modern portfolio showcasing the developer's skills and experiences, built on the Nuxt.js framework. This web application stands out due to its ease of deployment, making it a fantastic choice for anyone looking to establish a personal online presence without grappling with complicated setups. With a sleek design and user-friendly interface, it serves as an excellent example for developers seeking to create their own portfolio sites using contemporary web technologies.

Features

  • Nuxt.js Framework: Utilizes Nuxt.js, allowing for server-side rendering and enhanced performance while creating a dynamic portfolio.
  • Easy Installation: Simply clone the repository and run yarn to set up the project quickly and efficiently.
  • Development Mode: Offers a straightforward development workflow with the command yarn develop, enabling real-time testing in your browser.
  • Static Site Generation: By running yarn run build, users can create a fully static site, making it very easy to host anywhere.
  • Lightweight: As a static site, it requires minimal resources for hosting, ensuring fast loading times and a smooth user experience.
  • MIT License: Released under the MIT License, providing flexibility for personal use and further development.
  • Customization: The structure allows for easy modifications and personal branding, enabling users to tailor the site to reflect their unique styles.
gatsby
Gatsby

GatsbyJS is a free and open-source static site generator based on React. It uses a modern development stack including Webpack, GraphQL, and modern JavaScript and CSS frameworks. It also provides a rich set of plugins, starters, and themes.

nextjs
Next.js

Next.js is a React-based web framework that enables server-side rendering, static site generation, and other powerful features for building modern web applications.

nuxt
Nuxt

nuxt.js is a lightweight and flexible JavaScript framework that allows developers to easily build dynamic and reactive user interfaces. Its intuitive syntax, modular architecture, and focus on performance make it a popular choice for modern web development.

react
React

React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components

vue
Vue

Vue.js is a lightweight and flexible JavaScript framework that allows developers to easily build dynamic and reactive user interfaces. Its intuitive syntax, modular architecture, and focus on performance make it a popular choice for modern web development.

styled-components
Styled Components

Styled Components is a popular library for styling React components using CSS syntax. It allows you to write CSS in your JavaScript code, making it easier to create dynamic styles that are specific to each component.

chakra-ui
Chakra UI

Chakra UI is a popular open-source React component library that provides a set of accessible and customizable UI components to help developers create modern web applications.

blog
Blog

Blog websites feature posts written by one or more authors, organized by categories and tags, with a section for comments and archives sorted by date or topic. Additional features may include search bar, social media sharing, subscription or RSS feed, about and contact pages, and visual content.

framer-motion
Framer Motion

Alpine.js is a lightweight JavaScript framework that simplifies the process of creating dynamic, reactive user interfaces on the web. It uses a declarative syntax that offers a higher level of abstraction compared to vanilla JavaScript, while being more performant and easier to use than jQuery.

github-pages
GitHub Pages

Gridsome is a Vue.js-based static site generator that makes it easy to build fast and flexible websites and applications by leveraging modern web technologies like GraphQL, Webpack, and hot reloading

mdx
MDX

MDX is a format that allows developers to write JSX within Markdown documents, combining the power of React with the simplicity of Markdown. This allows for the creation of dynamic and interactive content that can be easily shared and consumed across different platforms and devices.

prismjs
Prism JS

PrismJS is an open-source, lightweight, and extensible syntax highlighting library that supports a wide range of programming languages and markup formats.

Stylelint

Stylelint is a modern linter for CSS that helps you avoid errors and enforce consistent styling conventions. It provides rules for detecting errors and warnings, and can be configured to match your specific project's requirements.

typescript
Typescript

TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.