Welcome to my personal website 👋, a unique digital space blending cosmic aesthetics, hacker ethos, and controlled dynamism. This site is intentionally dramatic, reflecting my distinctive personal brand.
Live Site: https://devxtechnic.github.io/
I conceived this project to create a personal website that authentically represents my identity and technical prowess. My key objectives included:
- Distinctive Design: A dark, interactive, and engaging user experience.
- Personal Expression: A platform that feels personal rather than corporate.
- Memorable Experience: Designed to be unique and leave a lasting impression on visitors.
- Technical Sophistication: Showcasing technical skills in a way that resonates with fellow developers.
My website incorporates a variety of interactive and engaging features: ✨
- Multi-Page Navigation: Seamless navigation across
Home,About, andContactsections. - Dynamic Theme Engine: A robust theme system offering multiple visual styles, including 'Liquid Glass' and 'Chaos' modes, with theme persistence across page transitions.
- Interactive Mini Terminal: A functional command-line interface for enhanced user engagement.
- Persona Quiz Game: An integrated game designed to interactively explore user personas.
- Live GitHub Repository Cards: Displays real-time project information fetched from
github.com/DevXtechnicvia the GitHub API. - Engaging UI/UX: Features such as easter eggs, pulse effects, and other dynamic interactions to create a vibrant user experience.
I leveraged a modern web development stack to deliver this project's rich features:
- HTML: For structuring the web content.
- CSS: For styling and implementing the diverse theme engine.
- Vanilla JavaScript: Powers all interactive elements, terminal logic, quiz functionality, and dynamic effects.
- GitHub Pages: Utilized for reliable and free hosting of my static site.
- GitHub API: Used to dynamically fetch and display my repository data.
The repository is organized as follows: 📁
index.html: My main landing page.about.html: Contains my lore, identity, and interests.contact.html: Provides direct channels to contact me.styles.css: Centralized stylesheet for all themes and UI styling.script.js: Contains all my JavaScript logic for interactions, terminal, quiz, and visual effects.
To set up and run my project on your local machine, follow these steps 👇:
- Clone the repository:
git clone https://github.com/DevXtechnic/DevXtechnic.github.io.git cd DevXtechnic.github.io - Serve the files:
You can use a simple Python HTTP server 🐍:
python -m http.server 8000
- Access the site:
Open your web browser and navigate to
http://localhost:8000. 🚀
- I included a
.nojekyllfile to ensure GitHub Pages serves files directly, bypassing Jekyll processing. - I manage theme state using
localStorageto maintain your selected themes across sessions. - I intentionally included over-engineered elements for demonstrative and exploratory purposes, reflecting my commitment to creative and technical experimentation. No regrets!
Contributions are welcome! If you have suggestions for improvements or new features, please open an issue or submit a pull request.
This project is unlicensed. Feel free to use, modify, and distribute it as you wish. 🔓
