There is a very specific kind of regret that hits when you deploy someone else's template, change the name and the profile picture, push it to GitH...
For further actions, you may consider blocking this person and/or reporting abuse
This is nice, but the speed is too slow. Design is great and looking awesome🙂.
Thankyou , I will try to improve the speed
Your argument about skipping frameworks like React for a single-page portfolio is spot on. The industry has conditioned people to bundle an entire runtime and node_modules just to render a static profile. Sticking to vanilla JavaScript, custom CSS, and selective libraries keeps the footprint clean and matches the exact scope of the project. It is refreshing to see someone defend proper fundamental architecture instead of over-engineering with a virtual DOM where it is not required.
Agreed. Frameworks are powerful tools, but for a static portfolio, they often introduce unnecessary bloat. Stripping it back to basics forces a deeper understanding of the browser's native capabilities.
The “over-clean” point you mentioned is honestly the most interesting part of the whole post.
Most people would just take that feedback as a compliment and move on, but you are already thinking about intentional imperfection and making it feel more lived-in, which is a much harder design problem than just polishing things.
I like the idea of the built-in blog for that. Actual writing usually does more to add that “someone lives here” feeling than any visual tweak ever can.
Curious if you already have ideas on how you want to introduce that texture without breaking the clean structure too much.
I'm leaning heavily into the blog for that exact reason. To keep the clean structure intact while adding character, I’m planning to use subtle typography shifts—like a more organic serif font for long-form text—and raw, unpolished dev logs alongside polished articles. I might also introduce slight asymmetrical layouts or custom, hand-drawn utility icons that break the rigid grid just enough to feel human.
That makes a lot of sense. Curious to see how you balance that over time, feels like one of those things that evolves with real usage more than planning.
Building a custom 3D mesh in Blender and optimizing the Three.js render loop is no joke for a web project. You made an excellent call by implementing a dedicated toggle to disable the 3D scene entirely for older mobile devices. Many developers throw heavy WebGL elements onto their landing pages without considering low-end hardware or initial layout shift, so deferring initialization shows real consideration for user experience.
Thanks for highlighting that. Performance isn't a "nice-to-have"—it's a requirement. Managing the render loop for mobile users ensures the site remains accessible regardless of hardware.
This is awesome. A custom-built portfolio says a lot more about your skills to potential employers than a pre-made theme ever could. Looking forward to seeing how you continue to iterate and grow it over time.
Really impressed by the commitment to building this from the ground up, Syed. There's a massive difference between knowing how to use a framework and understanding the architecture that makes it work. That 'hands-on' approach you've taken—especially with the custom Three.js implementation and optimization for mobile—is exactly what sets a developer apart. Great work!
There is a unique kind of satisfaction that comes from writing every line of code yourself. It is the best way to truly learn and understand how everything connects. Thanks for sharing your journey and inspiring others to ditch the templates.
Thankyou
Building a portfolio from scratch is no small feat, but the payoff is completely worth it. It gives you absolute control over your code and design, which templates just can't match. Great work on taking the harder, more rewarding route.
The attention to detail here is top-tier. Most people overlook the 'invisible' parts of a portfolio, but things like the llms.txt file and the deliberate choice to optimize the 3D render loop for mobile show that you’re thinking about the next generation of web accessibility. It’s refreshing to see someone focus on building a lean, performant experience rather than just adding layers of abstraction.
Using Bootstrap exclusively for the layout grid layer while writing pure custom CSS for the typography, variables, and animations is a fantastic middle ground. It prevents the typical utility-class bloat where HTML becomes unreadable, and as you mentioned, it forces you to actually debug the layout model yourself when things break rather than just guessing with random framework helper classes.
Exactly. Using Bootstrap only for the grid keeps the CSS modular without sacrificing control over the design system.
The inclusion of an llms.txt file is an incredibly forward-thinking addition for a personal site. Most portfolio tutorials stop at basic open graph tags, completely ignoring semantic search and structured JSON-LD data. Making your source code and documentation readily scannable for AI crawlers is going to become highly relevant as the landscape transitions away from traditional search engines.
Glad you noticed the llms.txt. With how quickly AI search is evolving, ensuring our personal sites are machine-readable is just as important as being human-readable.
This post highlights exactly why building from scratch matters. When you inherit a pre-built template, you lose the technical depth of knowing why specific performance trade-offs or design adjustments were made. Being able to explain every single animation, asset optimization strategy, and script choice line by line is precisely what differentiates a true engineer from someone who just modifies configuration files.
Understanding the "why" behind every line of code is what separates someone who just uses tools from an engineer who can truly master them.
The combination of TurnJS and TiltJS for the certifications section is a unique creative approach. Standard grid galleries for certificates usually end up looking uniform and monotonous. Combining an interactive flipbook mechanic with dynamic 3D hover states requires a lot of meticulous event handling to ensure it remains responsive on touch devices. It definitely breaks up the flat design feeling.
I wanted to avoid the "standard gallery" feel. Balancing those interactive libraries with touch-device responsiveness was definitely the trickiest part of the build.
Major respect for going the "no-template" route. It's so easy to just grab a component library, but actually writing everything from scratch forces you to truly understand how positioning, layouts, and responsiveness work under the hood.
That hands-on frustration is where the real growth happens, and it's a huge selling point to future employers who want to know you can actually build, not just copy-paste. Can't wait to see the final product!
I couldn't agree more. That 'hands-on frustration' is exactly how I’ve been describing it! It’s one thing to make a layout work with a library, but knowing why it works is a totally different level of understanding. Thanks for the kind words—it’s great to hear that this approach is valued!
Building from scratch is a massive milestone. There’s nothing quite like the feeling of wrestling with raw HTML/CSS, fixing broken layouts, and finally seeing your code come to life exactly how you envisioned it.
It takes serious discipline to resist the temptation of modern templates and UI libraries, but the deep learning you get from solving those foundational problems is unmatched. Keep pushing—this is how great developers are made! Looking forward to seeing the live link.
Thank you so much for the encouragement, Manal! You hit the nail on the head—it was definitely a challenge to resist the shortcuts, but wrestling with the raw code has given me such a better grasp of the fundamentals. I’m really proud of how it’s turning out, and I'll be sure to share the live link as soon as it's ready!
The inclusion of an llms.txt file is an incredibly forward-thinking addition for a personal site. Most portfolio tutorials stop at basic open graph tags, completely ignoring semantic search and structured JSON-LD data. Making your source code and documentation readily scannable for AI crawlers is going to become highly relevant as the landscape transitions away from traditional search engines. Combining that structured layer with unique UI mechanics like the TurnJS and TiltJS flipbook for certifications proves you can achieve immersive, interactive layouts without bloated, multi-megabyte modern frameworks. Incredible balance of human aesthetics and machine readability!
Really appreciate you noticing the balance between machine readability and the custom typography/animations. Thanks for reading so deeply into it.
It’s incredibly refreshing to see a portfolio built with structural integrity rather than just slapped together from a generic UI template. Using Bootstrap purely as a lean layout grid layer while writing custom CSS for the typography, variables, and custom animations prevents the exact kind of utility-class bloat that turns modern HTML into unreadable div soup. Forcing yourself to handle the native responsive breakpoints and fine-tune assets for Google Lighthouse means you actually understand the underlying browser layout engine. It's a great example of using AI as a multiplier rather than an architectural crutch!
Avoiding "div soup" and maintaining control over the layout engine was exactly the goal. I wanted the codebase to be as clean as the final UI, and treating Bootstrap as just a lean grid layer made that possible. Really appreciate you noticing the balance between machine readability and the custom typography/animations. Thanks for reading so deeply into it.
Clean work! There is no better way to actually learn the ins and outs of frontend development than by scraping the templates and coding every div yourself. Your portfolio is a great reflection of that effort. Looking forward to seeing how you evolve it over time! 🙌
Thank you so much, Zean! It definitely took some patience (and way too many hours fighting with CSS centering), but the learning experience was totally worth it. Appreciate the kind words and the support as I keep iterating on it!
There is something incredibly satisfying about building your own digital home completely from scratch. 🎨 Templates always feel like trying to fit a square peg into a round hole eventually, and you end up spending more time overriding CSS than if you'd just written it yourself.
Your focus on clean semantic HTML and custom CSS variables really pays off—the performance and load times must be blazing fast. Awesome work!
There is nothing quite like the feeling of writing every line of code yourself and seeing your vision come to life without the constraints of a template. It takes a lot of patience, but the learning experience is unmatched. Congrats on pushing through and getting it done—looks great!
Thank you for your feedback. I appreciate you sharing your thoughts, and I will certainly keep this in mind for the future.
This is awesome. Avoiding templates is one of the best ways to actually test your skills and learn how things work under the hood. It shows a lot of dedication to your craft and definitely makes your personal brand unique. Congrats on the launch!
Thanks a lot, Marokh! It’s been a rewarding process. There’s something really satisfying about having total control over every line of code. I appreciate the support and the shout-out regarding my craft—it definitely makes the hard work worth it!
Building a portfolio completely from scratch is such a massive milestone! It takes way more discipline to stare at a blank text editor and build it your way than to just tweak a template. Love the dedication to truly owning your craft. What was the most challenging feature or bug you had to tackle during the build? Keep up the awesome work!
Thanks, Zean! Staring at that blank canvas was definitely intimidating at first, so I appreciate the validation. To answer your question: the most challenging part was definitely getting the responsive layout completely fluid across mobile and desktop without relying on a heavy UI framework. Dealing with absolute positioning bugs almost broke me! Thanks for the encouragement!
Love to see this! Building from scratch is the absolute best way to truly learn and showcase your skills. It looks great, and you should be super proud of the hustle. Keep it up!
Appreciate the kind words, Najim! It was definitely a labor of love (and a lot of debugging), but doing it without templates made the end result so much more rewarding. Thanks for the boost!
What was the most challenging part of the build for you? (For me, it’s always getting the responsive layout just right!) Kudos on putting yourself out there!
Oh man, responsiveness is definitely a beast! For me, the toughest part was actually managing the custom CSS layouts and ensuring smooth transitions without relying on a heavy framework. I spent way too long wrestling with Flexbox alignments on mobile screens! Thanks for the kudos, putting it out there is terrifying but totally worth it.
Love this! Doing it from scratch is no small feat, but it’s easily the best way to truly learn and stand out. It looks awesome, congrats on the launch!
I completely agree with you on this. You summed up the core issue perfectly, and it is definitely something that needs more attention.