Replyke | Add comments to your React project easily

Souhail dev — Mon, 05 Jan 2026 08:52:27 +0000

✅100% free
✅Open-source
✅Fast & easy integration

Docs: https://docs.replyke.com/
Source: https://github.com/replyke/monorepo

Mapcn - Map components for Shadcn

Souhail dev — Sat, 03 Jan 2026 09:36:33 +0000

Beautiful map components. 100% Free, zero-config, one-command setup.

📖Docs: https://mapcn.vercel.app
📄Source: https://github.com/AnmolSaini16/mapcn

Thanks to Anmoldeep Singh for sharing such an amazing project!

How To Escape From Perfection As an Indie Hacker

Souhail dev — Mon, 14 Apr 2025 07:10:11 +0000

You just started a new side project to make some money, you are so motivated to start building it. You open Vscode, and you’re like: “This will only take 2 days to build“ , but day after day you found that the project is growing, and it becomes an endless loop with useless features that no one asked for and no one will ever use.

“Now my code is a mess! I guess I’ll just drop this project and start a new one”.

Nowadays, everyone wants to become an indie hacker, and why not? it’s very simple for anyone to become one. Here is what is takes: learn JavaScript, create an X account and keep posting anything (trash content is fine) with the hashtag #buildinpublic, and that's it, you are one of us now🎉!

Almost every one who calls themselves a solo founder has a hard drive with 1 TB of unfinished projects and 0 MB of completed projects.

Every time you had a new project idea, you start coding right away without thinking, and you try to make every detail perfect, and after a long time, here is the progress you made so far:

Let's say you somehow managed to finish your app and Finally your project is ready, time for generating some money🤑! You submit your app to ProductHunt and spam reddit with chatGPT posts, a few days later, you step on the reality that no one wants to pay for your app, no one even cares.

What’s the problem?

Well my friend, The problem is with the mentality, you think that everyone will go crazy after you launch your app, and it is a solution that people will say: “how did I survive without this!“. And while having this mentality, it's normal to aim for perfection, because you think that people will judge you why you made the button blue and not green.

Users don't care how did you build the app, is it using NextJs or PHP. Are you using YouTube because it's written in Rust or C++? no one cares about this! You are using YouTube because it's solving a problem for you, which is either to learn something, or for entertainment.

If you are always falling into the perfection trap, you need to learn how to drop it ASAP. This is an important skill that you need to learn, but this will need some training from you, this won't happen in a couple of minutes.

How to fix this?

Instead of jumping right away to VSCode and start a new project, you need to spend some time to have a general overview of what you are going to build, what are the features you will implement, and stick to them, because if you don't do that, you will enter a new loop that I like to call it the random-new-feature-that-no-one-asked-for-loop. Before start coding, write on a note app, what do you want to build and set deadlines, it is very important to set deadlines, not for every small thing, you are not working on a corporate, but set deadlines to the big parts of your app. After doing this, you will at least get a realistic overview on how much time this app could take to build before moving to the real work, which is marketing.

The problem with developers is that they have this engineers mindset, everything has a start and an end, a project starts with first line of code, and finishes when it's tested and deployed. But this mindset is the opposite of marketing, which is an endless loop, of testing different strategies, and iterating. I suggest you read the LEAN startup book to have an understanding on a very important principle, which is the Build-measure-learn loop.

I like to think of it like this: it's not a build-perfect-code and forget it, but instead it's writing a bad code, get the app in front of user, then improve code, then get the app again in front of users and so on....this picture will explain more:

When being a solo dev founder, the real work starts when you publish your app, not with your first line of code. Having this mentality will help you a lot, because even if you spend a year building the app, you know that the real work didn't start yet, which makes you be realistic, and not depressed after launching your app and not getting paid users, because you actually didn't do any marketing plan yet, the real work will start now.

What makes you spend too much time when building?

If we had something like screen time but for Vscode, to see what parts of code you are spending much time on, we will see that most of the time is spent on front-end and User Interface in general. and why not? UI is the gateway between the app and our user, it is the first thing that users sees, if it's bad, users will just leave the website!

Yes I agree, but it depends on what you are building. if the user is visiting your app because he needs a solution for his problem so bad, then he wouldn't care about the UI, even if your website has a 1999 web design style, as long as your service is fixing the user's problem.

Another important subject to fix this front-end time consuming problem is using Templates and boilerplates. Why would you build the UI from scratch while having some ready templates that you can use, the only time you will spend is to set it up. There is tons of templates and boilerplates out there, for any framework you can think of, and for any app type you want.

If you are a person who loves to build the UI from scratch, then a good advice is to have a GitHub repo where you save all the components that you previously used on previous projects.

If you managed to not touch the front-end part, then you will save a lot of time, and you will switch your focus to the core functionalities, which users actually needs.

Quick recap with a simple example
let's say I want to start a new project: a CRM tool that is simple to use and designed for solo founders. instead of jumping right-away into VSCode and see how things go, you need to spend some time to pull down all features that you want your MVP to have. Same thing for deadlines. Then start a draft project, say to yourself “this is just a draft to test code”, like a playground, and start implementing your core features on that draft. Then add a UI template to your draft, and that's it, congratulations! You already have finished your MVP, deploy it asap and then you'll start the real work: getting the app in front of users.

Feel free to follow me on X, where I share content related to web development, startups, UI, business 👉 https://x.com/souhail4dev

Understanding Easing Functions (the secret to smooth animations)

Souhail dev — Sat, 12 Apr 2025 18:37:46 +0000

Have you ever wondered what makes the difference between a simple animation and a smooth visually appealing one?

Take a look at these two animations:

animation 1 (linear) 👇

animation 2 (custom easing function) 👇

The first animation is called a linear function, it moves from point A to point B in a straightforward, robotic manner (a stable speed).
While the second animation, feels natural and fluid.

An easing function tells an animation how to behave as it transitions from one state to another. It defines the rate of change over time, giving animations their unique feel.

How Do I Create My Own Easing Functions?

The good news is: you don’t have to create them manually! There are plenty of resources available to help you get started. One of my favorites is easings.net

This website provides a collection of pre-made easing functions, complete with interactive previews. Simply hover your mouse over an easing function, and you’ll see how it behaves in real-time. Once you’ve chosen the perfect function for your project, you can copy its code directly.

The most important part of an easing function is its four parameters (commonly referred to as t, b, c, and d):
t : Current time
b : Starting value
c : Change in value
d : Duration
These parameters allow you to customize the behavior of your animation to fit your needs.

Where Can You Use Easing Functions?

Easing functions aren’t limited to web development—they’re versatile tools that can enhance animations in various domains:

Video Editing : Add dynamic transitions to your videos.
Website Animations : Make your UI/UX more engaging and user-friendly.
Game Development : Bring characters and objects to life with realistic movements.

Feel free to follow me on X for more content like this one: @souhail4dev
I also have a YouTube channel, where I cover similar topics: YouTube

NEXT-SAAS-LP: Cool Landing Page that is Free & Open-source

Souhail dev — Fri, 11 Apr 2025 18:35:13 +0000

Hello, this is souhail4dev

I created Next-SaaS-LP: a landing page that you can use for your SaaS business with a simple and clean UI

✅ Framer motion animations to make it look cool
✅ Fully responsive
✅ 100/100 Lighthouse score
✅ Free

Live demo preview 👉 https://next-saas-lp.vercel.app/
Github repo 👉 https://github.com/souhail4dev/next-saas-lp
How to edit 👉 https://youtu.be/uO4lm5zDfcQ

Follow me on X: https://x.com/souhail4dev
Enjoy :)

DEV Community: Souhail dev

Replyke | Add comments to your React project easily

Mapcn - Map components for Shadcn

How To Escape From Perfection As an Indie Hacker

What’s the problem?

How to fix this?

What makes you spend too much time when building?

Understanding Easing Functions (the secret to smooth animations)

How Do I Create My Own Easing Functions?

Where Can You Use Easing Functions?

NEXT-SAAS-LP: Cool Landing Page that is Free & Open-source