Skip to content

My personal website and online portfolio showcase my projects, skills, tech stack, owned games, etc., featuring optimized performance and an attractive UI design.

License

Notifications You must be signed in to change notification settings

omarx11/omar11.sa

Repository files navigation

Personal Website - Portfolio, Specs, Guestbook & more!

Vercel CodeFactor License Stars

~ This is the complete source code for the omar11.sa website.

Why did you build this website?

To demonstrate my programming skills, a place to showcase my work, and where people might know me better. and this may help me to get a great job.

After all, every programmer’s dream is to have a personal portfolio that shows his achievements, work, etc. 😊

Website Performance Optimization

From the beginning, my main focus was on speed and enhancing performance. This involved measures such as minimizing code size, optimizing images & using NEXT.js which has huge improvements overall. Like caching data requests & server-side rendering. This makes it faster in loading pages, and excellent for the user experience, in addition to a beautiful user interface & smooth animations.

Features

  • Simple, Minimal & Fast Rendering with Server Components.
  • SEO Optimised along with dynamic sitemap, OpenGraph tags.
  • GuestBook with Server Actions & Supabase database.
  • AI assistant that answers any questions about the website & its content.
  • Real-time Discord status! From Lanyard.
  • Stats of all the games I own using Steam API's.

Built with

Name Link
Framework Next 14 (App Router)
Database Supabase
Deployment Vercel
Styling TailwindCSS
Authentication SupabaseAuth
Animations framer-motion
Favicon Iconify

Follows all web standards, a 100 score on Lighthouse metrics!

Images Walkthrough

  1. Projects Page Projects page

  2. Skills Page Skills page

  3. Specs Page Specs page

  4. About Page About page

  5. Anime Page Anime page

  6. Games Page Games page

  7. Guestbook Page Guestbook page

  8. AI Bot Assistant AI assistant

Local Setup

Read the license note before cloning this website.

  1. Clone the repo

    git clone https://github.com/omarx11/omar11.sa.git
  2. Install dependencies

    npm install
  3. Create an .env file similar to .env.example and fill the keys.

  4. Start the development server

    npm run dev

Building and Running for Production

  1. Generate a full static production build

    npm run build
  2. Preview the site as it will appear once deployed

    npm run start

Contributing

Whether you're helping me fix bugs, improve the site, or spread the word, I'd love to have you as a contributor! 🤝

  • Asking a question: Open a new topic on GitHub Discussions explaining what you want to achieve / your question. I'll try to get back to you shortly.

  • Suggesting an improvement: Open an issue explaining your improvement or feature so we can discuss and learn more.

License

MIT © Omar Abdulaziz

Note: Anyone is free to take inspiration from this site as long as you give credit to the ordinal creator, credits should include my full name (Omar Abdulaziz) and a link to my site [https://omar11.sa/]

Refer License file for more info

Author Info

Give a ⭐️ if this project helped you! Thank you.. 💚

Back To The Top ↑

About

My personal website and online portfolio showcase my projects, skills, tech stack, owned games, etc., featuring optimized performance and an attractive UI design.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published