Omergulcicek.com

screenshot of Omergulcicek.com
nextjs
react
tailwind
cmdk
geist-ui
radix-ui

My personal website and blog built with Next.js, TypeScript, Tailwind CSS, shadcn/ui, and deployed on Vercel — open source on GitHub.

Overview

The personal website and blog created by Ömer Gülçiçek showcases the powerful capabilities of modern web development technologies. Built with Next.js, TypeScript, and Tailwind CSS, this project exemplifies a clean and efficient design, optimized for both performance and user experience. The combination of these technologies ensures a responsive site that provides a smooth and engaging interaction for visitors.

In addition to its technical excellence, the site is also accessible and SEO-optimized, making it a great resource for anyone looking to learn more about web development or simply enjoy rich content presented beautifully. The thoughtful inclusion of features like dark mode and analytics readiness further illustrates Ömer's commitment to providing a contemporary web experience.

Features

  • Performance Optimized: Leveraging Next.js 16 with Turbopack for rapid load times and efficient resource management.
  • Responsive Design: A mobile-first approach ensures that the site adapts beautifully across all devices using Tailwind CSS.
  • Modern UI: Incorporates clean and appealing design elements from the Shadcn/ui component library for a smooth user experience.
  • MDX Blog: Allows for rich content presentation with Markdown and JSX support, including code syntax highlighting.
  • SEO Optimized: Features like meta tags, structured data, and sitemaps help improve search engine visibility.
  • Accessible: Compliant with WCAG standards, utilizing Radix UI components to ensure usability for all visitors.
  • Dark Mode Ready: Includes a seamless theme-switching capability for users preferring dark mode.
  • Analytics Ready: Easily integrates with Google Analytics for tracking user engagement and site performance.
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.

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

tailwind
Tailwind

Tailwind CSS is a utility-first CSS framework that provides pre-defined classes for building responsive and customizable user interfaces.

cmdk
cmdk

cmdk is a fast, composable command menu component for React. It provides the foundation for building command palettes, search interfaces, and keyboard-navigable menus similar to those found in applications like VS Code, Linear, and Raycast.

geist-ui
Geist UI

Geist UI is a modern, minimalist React component library inspired by Vercel's design language. It provides clean, elegant components with a focus on simplicity and developer experience, perfect for building modern web applications.

radix-ui
Radix UI

Radix Primitives is a low-level UI component library with a focus on accessibility, customization and developer experience. You can use these components either as the base layer of your design system, or adopt them incrementally.

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.

eslint
Eslint

ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.

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.

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.

motion
Motion

Motion (formerly Framer Motion) is a production-ready animation library for React and JavaScript. It provides a simple declarative API for creating fluid animations, gestures, and transitions with excellent performance and accessibility.

recharts
Recharts

Recharts is a powerful and easy-to-use React library for building customizable and interactive charts. Built on D3.js, it offers a wide range of pre-built chart types, such as line, bar, pie, and scatter charts, all of which can be composed with a declarative syntax.

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.

zod
Zod

Zod is a TypeScript-first schema declaration and validation library. It allows you to define schemas that can validate data at runtime while providing excellent TypeScript inference, making it perfect for API validation, form validation, and type-safe data handling.