DEV Community: Jun Santilla

I Built a Nostalgic Social Network in 2026

Jun Santilla — Wed, 02 Sep 2026 08:55:38 +0000

A little over a week ago, I started building something I've wanted to see for a long time: a social network that feels more personal and nostalgic.

It's called Genggi.

The idea is simple: create a profile that actually feels like you, connect with friends, share posts and photos, and bring back some of the feeling that old-school social networking had.

Why I Started Building It

Modern social platforms feel increasingly optimized for feeds, engagement, and algorithms.

I wanted to build something different.

I miss the feeling of having your own profile, customizing it, seeing what your friends were doing, sharing random moments, and just exploring people's profiles.

So I started building Genggi as a small experiment.

Then it started getting more interesting.

Building It With Next.js

The current version is built with:

Next.js
TypeScript
Tailwind CSS
MongoDB
Cloudflare R2
Vercel

I'm using Next.js App Router for the application and MongoDB for the data layer.

For user-uploaded images, I'm using Cloudflare R2 so I can keep storage and delivery costs manageable as the platform grows.

Authentication is also integrated into the application, and I'm continuing to improve the security and moderation side as more people start using it.

The Design

One of the things I care about most is the feeling of the platform.

I don't want Genggi to look like another generic SaaS dashboard.

Profiles are an important part of the experience.

I want users to feel like their profile is their own little space on the internet.

It's Still Very Early

Genggi is currently in beta.

I started building it only a little over a week ago, so there are still plenty of things I want to improve.

I'm currently working on things like:

Better profiles
Friends and social connections
Comments and reactions
More profile customization
Better image handling
Performance improvements
Moderation and spam prevention
More nostalgic features

I'm Looking for Early Users and Builders

At this stage, I'm not trying to pretend Genggi is a finished product.

I'd rather have people try it, break things, tell me what's confusing, and tell me what they would want from a nostalgic social network.

I'm also interested in connecting with developers, designers, SEO people, and people who enjoy building communities.

If the idea sounds interesting, I'd love to hear what you think.

Genggi: https://genggi.com

It's still early, but I'm excited to see where it can go.

🚀 Launching Kravatar: The AI-Powered Avatar Generator

Jun Santilla — Fri, 27 Sep 2024 20:17:12 +0000

Hey, I'm Jun Santilla, a web developer with over 6 years of experience, and today I'm excited to announce the launch of my latest project, Kravatar! 🎉

Kravatar is a SaaS platform designed to help users easily generate unique avatars using AI. Whether you're a gamer, content creator, or just someone who enjoys customizing their online presence, Kravatar can generate avatars that fit your unique style. All you need is a prompt, and our tool takes care of the rest, using the powerful DALL-E AI to bring your vision to life.

Why Kravatar?

As someone passionate about web development and artificial intelligence, I wanted to merge these two fields to create something both fun and functional. Avatars are a big part of digital identity, and with Kravatar, you can create truly personalized avatars that go beyond the usual options offered by traditional avatar generators.

Here are a few reasons why Kravatar stands out:

AI-Driven Avatars: Using DALL-E, Kravatar generates high-quality, diverse avatars based on the descriptions you provide.

User-Friendly Credit System: You can easily purchase credits through our platform and use them to generate avatars at any time.

Custom Collections: Save and manage your favorite avatars in your collections page.

Mobile Responsiveness: Kravatar is designed to work smoothly across all devices.

Kravatar on Product Hunt

I'm thrilled to also announce that Kravatar is now live on Product Hunt! If you've been following the development process or are simply interested in seeing what Kravatar is all about, I’d really appreciate your support. You can check out the project, leave feedback, and of course, upvote if you find it useful.

Launching on Product Hunt is an exciting step for me. It’s a great community for discovering new tools and innovative ideas, and I’m looking forward to getting feedback from the tech-savvy community there.

Building Kravatar

The journey of building Kravatar has been both challenging and rewarding. I've been using Next.js 14 for the web application, which allowed me to build a fast, scalable platform with great flexibility. I integrated Stripe for seamless payment processing, enabling users to purchase credits securely. Firebase also plays a key role in handling user authentication, allowing login through both Google and Facebook.

For developers reading this, if you're interested in the tech behind Kravatar, feel free to check out the code or ask me about the implementation. I'm always happy to share insights and get involved in discussions about web development, AI, and everything in between.

What’s Next?

This is just the beginning! I have a lot of exciting features planned for Kravatar, including:

Enhanced Avatar Customization: More control over avatar features like facial expressions, backgrounds, and more.

Expanded Credit System: Offering subscription plans for frequent users.

Community Features: Letting users share and explore avatars from others in the Kravatar community.

Final Thoughts

Launching Kravatar has been a labor of love, and I’m eager to see where it goes from here. I hope you find Kravatar to be a fun and creative tool. Be sure to check it out, leave feedback, and help spread the word!

You can try Kravatar at kravatar.com and find it on Product Hunt.

Thanks for reading, and I can't wait to hear what you think! Let’s make your avatars as unique as you are.

My Hobby Project - Resume Builder - Next.js

Jun Santilla — Fri, 19 Jan 2024 20:33:51 +0000

I'm excited to share my hobby project: cvalley.io - a platform designed to make the resume-building process easy, efficient, and free. Whether you're a recent graduate entering the job market or an experienced professional looking to update your CV, CValley.io has got you covered.

CValley is open source on GitHub. Explore the project's key features and purpose, and feel free to contribute, provide feedback, or suggest improvements.

🏠 Homepage: https://cvalley.io/
🐙 GitHub: https://github.com/junsantilla/cvalley

SolidJS Code Snippets

Jun Santilla — Fri, 11 Aug 2023 07:56:04 +0000

This is a collection of code snippets for Solid.js, a declarative JavaScript library for building user interfaces.

https://github.com/junsantilla/solidjs-code-snippets

Usage

Install the extension in Visual Studio Code.
Open a Solid.js file.
Type the snippet prefix and select the desired snippet from the autocomplete suggestions.

License

This extension is released under the MIT License. Feel free to modify and use it to improve your Solid.js development workflow.

Enjoy!

My first VSCode Extension

Jun Santilla — Fri, 28 Apr 2023 08:52:36 +0000

It is my first VSCode Extension and one of my first projects since I started to explore Software development after being a WordPress Developer for almost five years.

Extension name is Code Typewriter Effect. This VSCode extension adds a typewriter effect to your code when activated. It is straightforward and easy to use.

Usage

To use this extension, follow these simple steps:

Open the file you want to apply the typewriter effect to in your Visual Studio Code editor.
Press Ctrl + Shift + P or Command + Shift + P on Mac to open the Command Palette.
Select Code Typewriter Effect from the available options in the Command Palette.
The typewriter effect will be applied to your code instantly.

Features

More features soon!

https://marketplace.visualstudio.com/items?itemName=junsantilla.code-typewriter-effect&ssr=false#overview

A hacker view of your github profile

Jun Santilla — Sat, 03 Dec 2022 23:37:05 +0000

For my next project while learning React.js. I created a app where you can view your github profile with greenish ui.

I just started to create the app and currently working on the mobile view of the profile page.

Check your own profile with the following link format.

https://githux.vercel.app/{username}

Github profile: https://githux.vercel.app/github

Repo: https://github.com/junsantilla/githux

A huge collection of UI resources

Jun Santilla — Mon, 21 Nov 2022 15:06:56 +0000

I created a collection of UI resources since I just started to study front-end development.

I will continue to update the list and website UI. Currently not mobile responsive.

Website: https://uiresources-io.vercel.app/
Repo: https://github.com/junsantilla/uiResources.io

Updates:
=> Add theme selection
=> Add footer section
=> Use daisyUI drawer for navigation mobile responsiveness
=> Main content mobile responsiveness

How to delete all commits history in GitHub?

Jun Santilla — Sat, 29 Jan 2022 07:10:16 +0000

Checkout to main branch
git checkout --orphan latest_branch

Add all the files from main branch
git add -A

Commit the changes
git commit -am "Initial commit"

Delete the main branch
git branch -D main

Rename the current branch to main
git branch -m main

Force update your GitHub repository
git push -f origin main

Gatsby tailwind hello world starter

Jun Santilla — Sun, 17 Jan 2021 13:20:24 +0000

Official gatsby hello world with tailwind CSS.

I just want to learn more about GatsbyJS and TailwindCSS, so I decided to combine them into one repository.

Github:
https://github.com/junsantilla/gatsby-tailwind-hello-world-starter

Install this starter locally:


gatsby new my-gatsby-project https://github.com/junsantilla/gatsby-tailwind-hello-world-starter

Responsive and Multi-level Navigation Menu

Jun Santilla — Mon, 16 Mar 2020 04:44:48 +0000

I have made a simple but responsive and multi-level navigation menu created with HTML, CSS, and a little bit of jQuery for the mobile view.

Source code and demo:
https://github.com/junsantilla/jsnav/

Note: For the demo, I include Twitter Bootstrap and Google Fonts.

Web Development Tools & Resources

Jun Santilla — Thu, 25 Jul 2019 07:35:32 +0000

I used the following tools and resources frequently.

HTML & CSS Checker

Performance Checker

Google Chrome Extension

Code Editor

Extension

Emmet

Image & Video Optimization Tools

If you have any useful tools and resources that currently not on the list, please write it on the comment box and we will keep this checklist updated.