Forem: dwikbtn

You’re Not “Oversharing” — You’re Being Trained On

dwikbtn — Fri, 23 Jan 2026 07:40:10 +0000

Most conversations about AI and data miss the point.

They frame the problem as user behavior:
“You shared too much.”
“You trusted the tool.”
“You should’ve known better.”

That’s convenient. And wrong.

The real issue isn’t that people overshare.
It’s that data extraction is happening invisibly, by default, and without meaningful choice.

The Moment No One Warns You About

Think about the moments where value is actually created:

• Uploading artwork
• Posting writing
• Submitting code
• Commenting in forums
• Training prompts, feedback, edits
• Simply browsing while logged in

In those moments, you’re not “talking to AI.”
You’re interacting with platforms — many of which reserve the right to use that interaction to train models.

Sometimes they say it clearly.
Sometimes it’s buried in policy updates.
Sometimes it’s vague by design.

But almost always, the same thing is true:

You don’t know what’s happening while it’s happening.

Awareness Isn’t the Fix. Agency Is.

Telling people to “be more careful” assumes they have the information and the leverage to act.

They don’t.

Reading Terms of Service isn’t realistic.
Tracking policy changes across platforms is impossible.
Finding opt-out paths — when they exist at all — is friction by design.

The problem isn’t ignorance.
It’s lack of agency at the point of interaction.

What WTOM Actually Does

WTOM (WhoTrainedOnMe) exists for one reason:

To interrupt invisible AI training at the moment it matters and give users a real choice.

When you visit a site, WTOM checks whether that platform:

• Uses user data to train AI
• Has a history of content scraping
• Offers an opt-out or protest mechanism
• Is vague or opaque about AI usage

If there’s a match, WTOM shows a small, contextual signal — right then, on that site.

Not a dashboard.
Not a warning banner.
Not fear-based messaging.

Just clarity — paired with action.

This Isn’t About Fear. It’s About Control.

WTOM doesn’t tell you what to do.
It doesn’t block anything.
It doesn’t assume intent.

It simply answers the question you’re almost never allowed to ask in real time:

Is this platform training on me — and can I do anything about it?

Sometimes the answer is “yes, and here’s how to opt out.”
Sometimes it’s “yes, and there is no opt-out.”
Sometimes it’s “unclear — and that’s the point.”

But at least you know before you contribute.

Why This Matters (Especially for Creators)

Artists, writers, developers, photographers — they create value constantly online.

And in many cases, that value becomes training data by default, without explicit consent and without compensation.

WTOM doesn’t solve the entire system.
But it does something rare:

It restores situational awareness + choice at the exact moment leverage normally disappears.

Where This Is Going

WTOM is early. The database is growing. Coverage is expanding. Reporting is manual and human by necessity.

But the direction is simple:

• Real-time AI training visibility
• Per-site opt-out and protest paths
• A future privacy dashboard that reflects your exposure, not just abstract risk

This isn’t about stopping AI.
It’s about stopping silent extraction.

If You Want That Control Back

WTOM is live now for:

Chrome + all Chromium browsers: Check it here
Firefox: Check it here
Use it.
Report sites.
Pressure platforms through visibility.

Because the most dangerous part of AI training today isn’t malice.

It’s that it happens quietly, while you’re busy creating.

I Built a Tool That Detects AI Training — And I Need Your Help.

dwikbtn — Wed, 03 Dec 2025 01:00:11 +0000

So… I built something.

A small browser extension that tells you when a website you’re visiting might be using your data to train AI models.

Not in a dramatic way.
Not in a “the robots are coming” way.
Just… transparency. Because right now, the average person has absolutely no idea where their data goes.

And I’d love your help making it better.

Why I Built WTOM

I’ve been following AI news for a while, and one thing keeps bothering me:
our data is being used to train models, but we’re rarely told how, where, or when.

Some platforms are clear about it.
Some hide the details in their Terms of Service.
Some don’t mention it at all.

Artists. Writers. Photographers. Developers.
All creating online… and quietly contributing to AI datasets without consent.

After a while, I realized:

There’s no easy way to check who’s training on your data.
So I decided to make one.

What WTOM Is

WTOM (WhoTrainedOnMe) is a browser extension for Chrome, Chromium-based browsers, and Firefox.

When you visit a site, WTOM checks if that platform:

Trains AI on user data
Has a history of content scraping
Offers any kind of opt-out or protest channel
Is vague or unclear in their AI policies
If the site matches, WTOM shows a small, respectful widget with this info.
No settings. No config. It just appears when needed.

It’s not perfect, but my goal is to give users clarity — not fear.

How WTOM Works (A Lot of Manual Research)
This part is very human and very messy, so I’ll be honest: I manually researched everything.

I read privacy policies.
I checked TOS updates.
I dug into past training datasets.
I looked at robots.txt files.
I cross-checked discussions from artists, creators, and researchers.

Every website gets a “rule” based on:

AI training status
Transparency level
Opt-out method
Available contact or protest channels
Overall behavior
It takes time. It’s tedious.
But it’s necessary.

WTOM will only be as accurate as the research behind it — and that’s where I need help.

I Need Your Help: Report Websites

WTOM now has a simple reporting feature.
If you’re browsing and find a platform that:

Trains AI
Has unclear AI policies
Uses your data in ways you didn’t expect or feels suspicious …you can report it directly from the extension.

That report comes to me anonymously, and I’ll investigate the site and add it to the database if needed.

This is the only way WTOM grows.
I can’t manually discover everything.
But together, we can map the web’s AI training behavior — site by site.

Search
Write
Notifications

dwi darma
Home
Library
Profile
Stories
Stats
Following
Hanief
Hanief
Find writers and publications to follow.

See suggestions
Our best price of the year.

Get 20% off new memberships for a limited time.

I Built a Tool That Detects AI Training — And I Need Your Help.
dwi darma
dwi darma
3 min read
·
23 hours ago

So… I built something.

A small browser extension that tells you when a website you’re visiting might be using your data to train AI models.

Not in a dramatic way.
Not in a “the robots are coming” way.
Just… transparency. Because right now, the average person has absolutely no idea where their data goes.

And I’d love your help making it better.

Why I Built WTOM
I’ve been following AI news for a while, and one thing keeps bothering me:
our data is being used to train models, but we’re rarely told how, where, or when.

Some platforms are clear about it.
Some hide the details in their Terms of Service.
Some don’t mention it at all.

Artists. Writers. Photographers. Developers.
All creating online… and quietly contributing to AI datasets without consent.

After a while, I realized:

There’s no easy way to check who’s training on your data.
So I decided to make one.

What WTOM Is
WTOM (WhoTrainedOnMe) is a browser extension for Chrome, Chromium-based browsers, and Firefox.

When you visit a site, WTOM checks if that platform:

It’s not perfect, but my goal is to give users clarity — not fear.

How WTOM Works (A Lot of Manual Research)
This part is very human and very messy, so I’ll be honest: I manually researched everything.

I read privacy policies.
I checked TOS updates.
I dug into past training datasets.
I looked at robots.txt files.
I cross-checked discussions from artists, creators, and researchers.

Become a member
Every website gets a “rule” based on:

AI training status
Transparency level
Opt-out method
Available contact or protest channels
Overall behavior
It takes time. It’s tedious.
But it’s necessary.

WTOM will only be as accurate as the research behind it — and that’s where I need help.

I Need Your Help: Report Websites
WTOM now has a simple reporting feature.
If you’re browsing and find a platform that:

Trains AI
Has unclear AI policies
Uses your data in ways you didn’t expect or feels suspicious
…you can report it directly from the extension.

That report comes to me anonymously, and I’ll investigate the site and add it to the database if needed.

This is the only way WTOM grows.
I can’t manually discover everything.
But together, we can map the web’s AI training behavior — site by site.

WTOM Is Now Live

WTOM is officially out for:

Chrome + all Chromium browsers: Check it here
Firefox: Check it here
This is the first public release, so things may not be perfect yet, but it’s stable and ready for real users.

If you care about AI transparency, data consent, or just understanding what the internet is doing behind the scenes, I’d love for you to try it.

I Made a Browser Extension That Tells You When a Site Uses Your Data to Train AI

dwikbtn — Tue, 18 Nov 2025 12:55:12 +0000

AI is everywhere now, and most of us still have no idea where these models actually get their training data from. The more I looked into it, the more uneasy I felt — because the answer is often: from us.

Your posts.
Your art.
Your photos.
Your comments.

A lot of platforms train AI on user content, and most people don’t even know it’s happening. Some companies are explicit about it, others hide it in the TOS, and many don’t mention anything at all. There’s no standard, no consistency, and no real transparency.

So I built something that I wish existed:

WTOM (WhoTrainedOnMe) — a browser extension that tells you whether the site you’re visiting might be using your data to train AI.

Why I Built It

I kept running into the same problem:
There is no simple way to know if a website uses your content to train AI models.

Opt-out options (when they exist) are buried.
Policies are vague or intentionally confusing.
Artists and creators feel like their work gets scraped with no consent.

WTOM’s goal is pretty simple:
Give people transparency, and give them a path to say no.

How WTOM Works

The extension checks the domain you’re visiting and matches it with a curated database of:

Whether the platform trains AI
How transparent they are about it
Whether an official opt-out exists
What users can do next (opt-out or protest)

If the site is flagged, a small, clean widget appears on the page with the details.
No setup required — it just works.

You can:

Jump directly to the opt-out toggle
Or send a protest email (formal, gentle, or bold)
With your info filled in locally
Nothing stored server-side
The idea is not to scare people. It’s simply to inform and empower them

The Surprising Part

While building WTOM, I learned how messy this space really is:
Many popular sites used in AI training datasets say nothing about it
Some hide their AI policies behind multiple pages
Some only offer partial opt-outs
Some explicitly deny training but still have loopholes

Artists and writers are the most impacted but the least informed

It confirmed one thing for me:
People need tools that bring clarity to all of this.

What’s Next

WTOM is still growing, and there’s more coming:

Expanding the domain list
Better accuracy on training + transparency labels
A small public reference page
More educational content
A “transparency score” experiment I don’t think AI is the enemy — but lack of transparency is.

Try it Now

Chrome/Chromium versions: Check it here
Firefox version: Check it here

Your digital life shouldn’t be invisible training data.
WTOM won’t fix everything, but it makes the process visible — and visibility gives you control.

Thanks for reading. If you have thoughts or feedback, I’d love to hear it.

Is Your Data Training Someone’s AI? I Built a Browser Extension to Find Out.

dwikbtn — Mon, 17 Nov 2025 17:40:59 +0000

I’ve been thinking a lot about AI lately. Not the cool stuff, the other side of it.

Every time I scroll the internet, I keep wondering: “Is this website using my data to train AI?”

And the more I looked into it, the more uncomfortable it felt. A lot of companies are either vague about their AI policies, or they hide everything deep in their Terms of Service. Some are very clear about training on user content. Some pretend to be clear. Some don’t mention anything at all.

Either way, the normal user has no idea.

So I decided to build something that would tell you instantly. Whether a site you’re visiting might use your data to train AI.

And that’s how WTOM (WhoTrainedOnMe) started.

The Problem: Zero Transparency

Most AI models today were trained using massive scraped datasets.
Your posts, your art, your photos, your comments — anything public.

But here’s the issue:

Most platforms bury their AI training info
Opt-out options (if they exist) are hidden
Some don’t allow opt-out at all
And many use vague phrases like “improving our services”

It feels like the internet is being quietly vacuumed into AI systems, and nobody told us.

As someone who works with creators and builds products, this didn’t sit right with me. People deserve to know what's happening to their data.

What I Wanted to Build

I wanted something extremely simple:

When you visit a website, your browser should whisper:
“Hey, this site might use your data to train AI. Want to opt out?”

No drama.
No fear-mongering.
Just transparency.

If the platform offers an official opt-out, great.If not, you should still have a way to push back, like sending a protest email.

And it all had to feel natural. Minimal UI. Zero setup. Just works.

Researching AI Training Across the Web

This part was… a journey.

I read a lot of TOS documents. Too many, honestly.
Some were clear.
Some felt intentionally unclear.
Some were 20+ pages of lawyer-speak.

I ended up categorizing platforms into:

Explicit — clearly training AI on user data
Vague — “may use your content for service improvement”
Unclear — no mention or confusing
Denied — explicitly say they don’t train AI with your data

It was surprising how inconsistent everything is.

Even more surprising:
Some sites used in major training datasets never mentioned AI at all.

Building WTOM (The Fun Part)

The extension itself is built with:

WXT
React
Supabase

A structured config system so each platform has its own rules

WTOM works like this:

You visit a website
WTOM checks its domain against the database
If it’s flagged, a small widget appears on the page

The widget shows:

Whether the site trains AI
How transparent they are
The link to their TOS
Whether you can opt out
What you can do next

You don’t need to open any settings.It just pops up when needed.

Opt-Out and Protest

This part matters.

Some platforms have official opt-out: toggles, forms, or email requests.
WTOM connects you directly to those. But many don’t offer anything.
So WTOM also lets you send a protest email — something like:

“I don’t consent to my data being used to train AI.”

You can even choose your tone:

Formal
Gentle
Bold

Your name and email auto-fill locally (nothing is stored).

It’s not perfect, but it gives you a voice where there wasn’t one.

Things That Surprised Me While Building

How many platforms don’t mention AI at all
How many hide their opt-out behind 3–5 clicks
How inconsistent the language is
How many creators feel powerless
How many AI training datasets contain images/art pulled from everywhere

One of the wildest things was seeing how many domains show up repeatedly in scraped datasets — Pinterest, DeviantArt, blogs, Flickr, Tumblr, etc.
These are places where artists post work.
No wonder creators feel like they’re being used without consent.

Why This Matters

AI isn’t going away, and I’m not against AI at all.
What I’m against is the lack of transparency.

Users should:

Know what’s happening
Know who’s training on their data
Have a way to say no
Have a simple tool that makes it easy

WTOM isn’t going to fix the whole system, but it’s a step toward giving people real control.

What’s Next for WTOM

A few things I’m planning next:
Adding more domains
Improving accuracy of training + transparency labels
A public domain reference page on the website
Better onboarding
More educational content
Maybe a Transparency Score system later This is a long-term project, but I’m excited about where it’s headed.

Try WTOM

If you’re curious whether sites you browse might be using your data to train AI, try WTOM:

Chrome/Chromium versions: Check it here
Firefox version: Check it here
If you want to support the project, I’ll leave a BuyMeACoffee link soon.

Final Thoughts

Building WTOM made me realize how little visibility we have into how our digital life is used.
Everything we create online — art, text, comments, photos — can quietly become training data.

WTOM won’t stop AI, but it gives you information, and information gives you choices.

If this project helps even a few people feel more in control, that’s already a win.

My Go-To Tools for Building Chrome Extensions

dwikbtn — Thu, 19 Jun 2025 17:39:33 +0000

Building Chrome extensions can feel overwhelming at first, especially when you're not sure what tools to use. After working on several freelance projects and building my own extensions, I’ve found a reliable set of tools that make development faster, easier, and way less frustrating. In this post, I’ll share the tools I personally use to build Chrome extensions for both clients and personal projects.

1. WXT – Next-gen Web Extension Framework

If you’re still using crxjs or manually setting up your manifest, it’s time to look at WXT. It’s a modern framework built specifically for Chrome extension development, and it comes with everything you need out of the box. Hot Module Reloading, manifest v3 support, Vite integration, and smart defaults.

WXT removes a lot of the boilerplate and lets me focus on actually building the extension. It works great with React and makes the dev experience smooth, especially when dealing with different extension contexts like background, content scripts, and popups.

2. React + Vite

I usually use the WXT template that comes with React + Vite. React helps me structure my UI better, especially for complex extensions with popup or options pages. And Vite makes everything load fast—it’s just a no-brainer combo.

For example, in one extension I built for a freelance client, I used React to manage a multi-step form inside the popup. Without it, managing state and UI updates would’ve been a mess.

3. Tailwind CSS

Tailwind is my go-to styling solution for almost everything I build—including Chrome extensions. It helps me move fast and keep the design consistent without writing custom CSS from scratch.

Even though it’s just an extension UI, I still want it to look clean and professional. Tailwind gives me that with utility-first classes and no need to open a separate CSS file. It also plays well with React and WXT, which is a big win.

4. @webext-core/messaging

Sending messages between background scripts, content scripts, and popups in Chrome extensions used to drive me nuts. I’d lose time debugging chrome.runtime.sendMessage and wondering why the listener didn’t fire.

Then I found @webext-core/messaging, and it changed everything.

This library makes messaging feel like calling functions—super clean and readable. It supports TypeScript out of the box, so you get autocomplete and type safety. Installing it is easy, and once you use it, you won’t go back to the native messaging API.

5. Supabase – For Auth and Database

A lot of my freelance projects need some kind of backend—usually for user authentication, saving settings, or storing user data. Supabase is my go-to for that.

It’s like Firebase, but with a SQL-based database (PostgreSQL) and a much better dev experience. I use Supabase for handling user auth (with magic links or OAuth) and for storing any extension-related data securely.

Because freelance work often comes with tight deadlines, I need tools that are fast to set up, reliable, and secure. Supabase checks all those boxes.

These are the core tools I rely on when building Chrome extensions, both for myself and freelance clients. They help me build faster, avoid common bugs, and create extensions that actually work well and look good.

If you're diving into Chrome extension development, I highly recommend trying some (or all) of these tools. They’ve saved me time and frustration—and hopefully, they’ll do the same for you.

Got a Chrome extension idea and need a developer to bring it to life? I’m available for freelance work. Whether it’s building from scratch or improving an existing extension, I’d love to help reach out to my email: dwidarma101@gmail.com or connect with me on LinkedIn.

What I Learned from Converting My 6-Year-Old Create React App Personal Website to Next.js

dwikbtn — Wed, 18 Jun 2025 08:44:51 +0000

You know that feeling when you open an old project you haven’t touched in years? Yup, that was me.
Six years ago, I Built my personal project website using Create React App (CRA). It was one of the first “serious” React projects I made, back when I was still figuring things out. At the time, it worked, it looked decent, and I was proud of it. After I'm landing job, I practically abandoned it.

Fast-forward to now, I'm a very different Developer. I’ve worked on teams, led frontend projects, built Chrome extensions, and shipped products. Then I looked back at my old portfolio, I realized the code quality is terrible.

I decided to rebuild it. Not patch it. Not update a few dependencies. But completely migrate it from CRA to Next.js, using everything I’ve learned since then.

The Problem: My Own Lagacy code

Because this was my personal project, every line of code was like a note from my past self. Some were sweet. Others were… a little embarrassing. Here's what I was dealing with:

Old React patterns (class components, remember those?)
Weird folder structure
Packages that wouldn’t update due to breaking peer dependencies
Webpack overrides I no longer remembered writing
styled-components everywhere
classnames used inconsistently

The biggest red flag? I couldn’t even upgrade some packages. The dependency tree was so tangled that running npm update broke the entire build. Some libraries hadn’t been maintained in years. I tried to update it. I really did. But eventually I admitted: It would be faster and cleaner to rebuild this from scratch.

The Rebuild: Next.js with App Router

Instead
Instead of fighting against the old setup, I took a deep breath and nuked the repo (after backing it up, of course).

I started a new project using Next.js 14 App Router, and committed to doing things the modern way:

File-based routing
Server components where it made sense
Layout.tsx + loading.tsx for better structure and UX Initially, I struggled with Next.js file-based routing, but I eventually learned and got used to it. Because this was my own site, I could experiment freely. No stakeholders. No pressure. Just the joy of building again.

Tailwind Made It Fun Again

The original project used custom SCSS and BEM conventions. Nothing wrong with that... but maintaining that across dozens of components was painful.

So I switched to Tailwind CSS. The latest version, with JIT enabled, custom themes, and all the goodness.

The original project used custom SCSS and BEM conventions. Nothing wrong with that... but maintaining that across dozens of components was painful.

I switched to the latest version of Tailwind CSS, embracing its JIT compiler, custom themes, and other powerful features, with the help of a ChatGPT agent for CSS rewrites.

What I Learned Along the Way

Here’s the fun part. Migrating this beast taught me a lot—not just about Next.js, but about dev life in general.

1. Don’t Be Afraid to Start Over

Trying to patch legacy code feels noble, but sometimes it's a waste of time. Starting fresh let me rethink architecture, remove dead code, and use modern tools without guilt.

2. The App Router Makes You Think in Components Again

I love how app/ forces you to structure code cleanly: layouts, loading states, nested routes, etc. At first it was a bit weird. Now it makes perfect sense.

3. Legacy Doesn’t Always Mean Bad, But It Usually Means Slow

Older code isn't necessarily terrible. In fact, this app still worked. But maintaining it was like fixing a bike with a spoon. You can, but why would you?

Final Thoughts

Migrating a client project is one thing.

Migrating your own project, the one you built when you were just starting out—is something else entirely. It’s not just technical work; it’s emotional. You see how far you’ve come. You laugh at your old decisions. And you get a chance to write cleaner code, not to impress anyone else—but for your own future self.

If you’ve been putting off updating your personal site… maybe this is your sign.

Start clean.
Try something new.
Use it as a playground to sharpen your tools.

You’ll learn more than you think.

The personal website is: https://dwidarma.codes

I Just Got Laid Off: This Is How I Coped With It

dwikbtn — Wed, 02 Oct 2024 03:11:02 +0000

Unironically, three days after I posted this, I got laid off. Getting laid off sucks. There’s no sugarcoating it. Whether it’s the infamous "tech winter" or the constant ups and downs of the software engineering world, losing your job can feel like someone just pulled the rug out from under you. If you're going through it right now, I’ve been there too. Here’s what worked for me—and hopefully, some of it can help you as well.

1. Take a Break: It's Okay to Pause

When I got laid off, I didn’t jump into action right away. I gave myself permission to do nothing for a while. I took a week to let it all sink in. No rushing into the job market or endless LinkedIn scrolling. I knew I needed some time to process.

Why should you consider this? Being laid off is not just a financial hit; it’s an emotional one too. Let yourself grieve the loss. It’s totally fine to not have a plan for a little while. Use this break to recharge and think about what you really want to do next. For me, that pause was necessary to gain some perspective.

How to Maximize Your Break:

Unplug: Avoid obsessing over job boards for a few days. Your mental health will thank you.
Revisit your hobbies: Read that book, catch up on that Netflix series, or go hiking. Do something that brings you joy outside of work.
Reflect: What did you enjoy in your previous job? What did you hate? This downtime is a chance to reassess.

2. Dive Into Something New: For Me, It Was Game Development

Once I’d had my break, I needed something to focus on, and I realized it was time to chase a long-time interest—game development. As a software engineer, I already had the skills to code, but game development was an entirely different beast. Still, the prospect of learning something new felt refreshing.

If you’re a techie like me, why not explore a passion project or new tech stack? Maybe you’ve been eyeing machine learning, blockchain, or even product management. Now is a great time to build something for yourself or start learning new skills.

Why Learning Something New Helps:

It keeps you sharp: When you’re learning, you’re still growing professionally, even if you’re not working.
You stay productive: Instead of fixating on the uncertainty, you’re pouring energy into something tangible.
It’s fun: Let’s face it, working on a personal project feels more fulfilling than just sending out endless resumes.

3. Freelance to Pay the Bills and Fund the Dream

After I started learning game development, the next question was, "How do I pay the bills?" Going broke while working on my passion project was not part of the plan. So, I decided to start freelancing. With my background as a software engineer, there were tons of opportunities to pick up freelance gigs.

Freelancing allowed me to:

Fund my game development journey: Those freelance checks became the lifeline that kept my passion project going.
Pay the bills: Realistically, you still need to eat and pay rent. Freelancing gave me financial flexibility without having to commit to another full-time gig.
Stay connected: Freelancing kept my foot in the door with the industry, which is crucial if I decide to reenter the workforce down the line.

Tips for Freelancing After Being Laid Off:

Leverage your network: Reach out to previous employers, colleagues, or connections on LinkedIn for potential leads.
Use freelancing platforms: Websites like Upwork, Fiverr, or Toptal can connect you with clients.
Set boundaries: It’s easy to overwork yourself, especially when freelancing. Balance is key if you’re also working on a side project like I was.

4. Focus on Your Health: Mental and Physical

Job loss hits hard, and it can easily mess with your mental and physical health. That’s why I made it a point to prioritize self-care. Freelancing and game development took up most of my day, but I still made time for exercise, meditation, and the occasional long walk.

When you're laid off, it's crucial to keep your health in check. Stress can quickly escalate, and when your brain's fried, it’s harder to make clear decisions. So, I made self-care part of my daily routine, and it helped me keep things in perspective.

Quick Self-Care Tips:

Exercise regularly: You don’t have to hit the gym, but even 30 minutes of walking or stretching can boost your mood.
Try mindfulness or meditation: Apps like Calm or Headspace can help clear your mind.
Connect with friends and family: Don’t isolate yourself. Even a quick chat can make a world of difference.

5. Rebuild Your Confidence: You’re More Than a Job Title

Getting laid off made me doubt myself for a bit. Was I good enough? Did I miss a red flag? Could I have done more? These thoughts are normal, but I had to remind myself that my worth wasn’t tied to a job title.

You’re not just a software engineer; you’re a person with skills, passions, and potential. It took me some time to rebuild that confidence, but working on projects like game development and freelancing helped remind me of what I’m capable of.

How to Regain Confidence:

Celebrate small wins: Finished a course? Nailed a freelance project? Celebrate it.
Talk to a mentor: If you’ve got a mentor or former boss you trust, talk things through with them. They can give you the perspective you might lack right now.
Keep learning: The more you invest in yourself, the more confident you’ll feel about your future.

6. Plan for What’s Next (Without Stressing)

Finally, after you’ve had some time to process and regroup, it’s good to start thinking long-term. Maybe you want to go back to full-time work, or maybe freelancing and side projects are your new jam. Whatever it is, take it one step at a time.

For me, I’m balancing game development with freelancing for now. But I also keep an eye on job openings, just in case the right opportunity pops up. The key is not to rush the process. We’re all figuring it out as we go along, and that’s totally okay.

Building Your Next Steps:

Revisit your goals: Do you want another corporate job, or would you rather continue freelancing? What about entrepreneurship?
Start slow: Don’t overwhelm yourself by applying to 100 jobs in one week. Quality over quantity.
Network: Even if you’re not ready for full-time work, stay active on LinkedIn, attend industry events, and keep up with your contacts.

Just saying, we could make this work. Let’s collaborate and fund my dream—one freelance gig at a time!

Okay, let’s get real for a second—if you want to help a laid-off software engineer (aka, me) fund their game development dreams, why not hire me as your freelancer? It’s a win-win! You get a dedicated, hardworking (and did I mention slightly desperate?) developer, and I get to continue working on my passion project without eating instant noodles every night.

Whether you need some front-end magic, a quick bug fixes, or help to build the next big thing, I’m your person! Plus, think of the cool story you’ll have: “I helped fund the next big indie game by hiring a laid-off dev!” How’s that for a LinkedIn humblebrag? Contact me at my email

Conclusion: It’s All Part of the Journey

Getting laid off isn’t easy, but it doesn’t have to be the end of the road. In fact, it can be a chance to explore new opportunities, whether it’s a new career path, freelancing, or that passion project you’ve always wanted to pursue. Take the time to breathe, reflect, and remember—you’re more than just your job.

Take it from me. I took a break, dove into game development, and started freelancing to fund my dream and pay the bills. And you can do it too, in your own way.

You’ve got this.

How to Stop Procrastination as a Work-from-Home Programmer

dwikbtn — Sun, 22 Sep 2024 17:10:07 +0000

Practical Tips to Break the Cycle and Get Stuff Done

Working from home as a software engineer is a double-edged sword. On the one hand, you’ve got the flexibility to work in your pajamas, enjoy your cozy setup, and avoid the commute. On the other hand, the same flexibility can sometimes lead to a dangerous trap—procrastination.

As someone who’s spent time coding in bed, surrounded by distractions, I know how easy it is to fall into that cycle. But breaking out of procrastination as a programmer is possible! In this guide, I'll walk you through some effective strategies to help you stay productive while working from home.

1. Identify Your Procrastination Triggers

Recognize What’s Slowing You Down

Before you can stop procrastination, you need to know what’s causing it. As a work-from-home programmer, distractions come in many forms: social media, household chores, that new video game, or even Netflix.

Action Steps:

Take inventory: Pay attention to what pulls your focus away when you're supposed to be coding.
Track your time: Use apps like RescueTime or Toggl to monitor how you’re actually spending your day. This can help you see patterns in your procrastination.
Identify trends: Are you more likely to procrastinate when you’re facing a difficult task? When your project isn’t interesting? Pinpoint these moments.

Knowing your triggers is the first step to tackling procrastination head-on.

2. Create a Dedicated Workspace

Separate “Work” from “Home”

One of the biggest challenges of being a work-from-home software engineer is the blurred line between personal and professional space. When your home is your office, it's easy for distractions to seep into your work time.

Action Steps:

Designate a workspace: Find a specific area in your home to work—whether it’s a corner of your living room or a separate room entirely. The key is to create a boundary between your work and relaxation zones.
Set up ergonomically: Since you're a programmer, you’re likely spending hours in front of a screen. Invest in a good chair, desk, and monitor setup to keep your posture right and reduce fatigue. A comfortable space will make you want to stay and get things done.
Minimize distractions: Remove unnecessary items that could divert your attention. This is your focus zone.

When you create a space that’s just for work, it becomes easier to shift into “work mode” and leave procrastination at the door.

3. Master the Pomodoro Technique

Break Your Work into Manageable Chunks

Ever sit down to code, only to stare blankly at your screen for an hour? You might be overwhelmed by the size of the project, and that’s where the Pomodoro Technique comes in handy.

Action Steps:

Set a timer for 25 minutes: During this time, focus on one task. Just one. After 25 minutes, take a 5-minute break.
Repeat the cycle four times: After four Pomodoros, give yourself a longer break—15 to 30 minutes.
Start small: If 25 minutes feels too long, you can even start with 15-minute work intervals. It’s about building momentum.

The beauty of Pomodoro is that it turns your work into bite-sized chunks, which feels less overwhelming. Plus, those short breaks give your brain a reset.

4. Use Task Prioritization Techniques

Work on What Matters Most First

As a software engineer, you’re juggling multiple tasks—from debugging to feature development to code reviews. Procrastination often happens because you don't know where to start.

Action Steps:

Try the Eisenhower Matrix: This method helps you prioritize by urgency and importance. Divide tasks into four quadrants:
1. Important and Urgent
2. Important but Not Urgent
3. Not Important but Urgent
4. Not Important and Not Urgent
Follow the 1-3-5 rule: Choose one big task, three medium tasks, and five small tasks to complete each day. This helps you avoid decision fatigue and keeps you on track.
Tackle the hardest task first: Often called “eating the frog,” tackling the most daunting task first thing in the day makes the rest of your to-dos seem easier.

By prioritizing, you remove the mental clutter that leads to procrastination.

5. Set Clear Boundaries with Family and Friends

Communicate When It’s Work Time

Working from home might make those around you think you’re always available. Whether it's a spouse, roommate, or kids, interruptions can easily derail your productivity as a programmer.

Action Steps:

Establish work hours: Set specific hours when you’re “on the clock,” and communicate this to the people in your household.
Create visual cues: Something as simple as wearing headphones or closing the door can signal that you’re in work mode.
Use technology for focus: If interruptions are frequent, consider using tools like Noise-cancelling headphones or a “Do Not Disturb” mode on your devices.

Setting these boundaries not only keeps distractions at bay but also signals to yourself that you’re in work mode.

6. Practice Self-compassion and Take Breaks

Don’t Be Too Hard on Yourself

Here’s a truth bomb: nobody is productive 100% of the time. As a work-from-home software engineer, some days will feel more like a struggle than others. And that's okay.

Action Steps:

Forgive yourself for slip-ups: Everyone procrastinates occasionally. Don’t beat yourself up over it; just refocus and start again.
Schedule breaks: If you’ve been working hard, take a real break. Go for a walk, stretch, or grab a coffee. Allow your mind to reset before diving back into work.
Celebrate small wins: Finishing a tough coding problem? Pushing an important feature live? Celebrate it! Acknowledge your progress, no matter how small.

Procrastination can lead to a cycle of guilt, but the key is to break that cycle with compassion and understanding.

7. Use Accountability Tools

Stay On Track with a Little Help

Sometimes, the biggest hurdle in working from home is accountability. When you don’t have colleagues around, it’s easier to procrastinate without consequences.

Action Steps:

Find an accountability buddy: Whether it’s a fellow programmer or a friend who also works from home, check in with each other regularly about your progress.
Use productivity apps: Apps like Todoist, Trello, or Asana are great for tracking your tasks and progress. They help keep your to-dos organized, so you’re less likely to procrastinate.
Join online communities: Sometimes, just knowing others are in the same boat as you can be motivating. Join work-from-home or programming communities where people share productivity tips and experiences.

Accountability doesn’t always mean having a boss check in on you—it can come from peers, apps, or communities.

By following these strategies, you can kick procrastination to the curb and find a rhythm that works for you. As a work-from-home programmer, productivity doesn’t have to be a struggle—you just need the right tools and mindset to keep you on track. With a little patience and persistence, you’ll be coding like a pro in no time.

Meta description: Struggling with procrastination as a work-from-home software engineer? This guide shares practical tips and techniques to stay productive, manage distractions, and maintain focus.

How to Keep Your Cool in Tech Winter

dwikbtn — Sat, 21 Sep 2024 17:15:54 +0000

Practical tips to stay grounded and thrive during challenging times in the tech industry.

Introduction

The “tech winter” is a term that’s been tossed around a lot lately, describing a period of slowed growth, layoffs, and reduced opportunities in the tech world. It’s a time when software engineers, programmers, and those looking to break into the industry face an uphill battle. While the market cools down, staying sane and positive is more important than ever. Whether you're job hunting or simply trying to maintain motivation, this guide will walk you through practical ways to navigate the chill and keep yourself on track.

1. Understanding the Tech Winter: What’s Really Happening?

Tech cycles happen—here’s why it’s okay.

Before diving into how to stay calm, it's essential to understand what "tech winter" really means. Every industry experiences ebbs and flows, and technology is no exception. Booms bring innovation and rapid hiring, but winters slow down progress, leading to layoffs, hiring freezes, and fewer opportunities.

Historically, the tech industry has had cycles, and while this downturn might seem overwhelming, it’s not permanent. Technology constantly evolves, and with change comes the opportunity to grow. This cycle will pass, and when it does, new opportunities will emerge. So, step one to keeping sane is simple: know that this is temporary.

2. Develop a Growth Mindset

Keep learning, keep moving.

In times of uncertainty, adopting a growth mindset can make all the difference. If you're a software engineer or programmer, this period might feel like your skills are becoming obsolete or opportunities are slipping away. Instead of focusing on what you can’t control, shift your energy toward what you can control—your growth.

Take action steps:

Upskill: Learn new programming languages, tools, or frameworks. Many online resources, such as Udemy, Coursera, and freeCodeCamp, offer affordable or free courses.
Certifications: Consider earning certifications in in-demand areas like cloud computing (AWS, Azure), DevOps, or cybersecurity. These fields are resilient even during downturns.

This approach ensures that when the market warms up again, you're ahead of the game.

3. Stay Connected with Your Network

Your connections are your lifeline.

Job hunting during a tech winter can feel isolating, but staying connected with your network is crucial. It's easy to retreat into yourself when times get tough, but your professional connections can provide you with support, guidance, and even job leads.

Here’s how to make networking easier:

Leverage LinkedIn: LinkedIn is an essential platform for tech professionals. Engage with posts, share insights, and reconnect with former colleagues. Visibility increases your chances of hearing about opportunities.
Join online communities: Places like Stack Overflow, GitHub, or Reddit tech groups can be excellent for learning, sharing, and expanding your network.
Attend virtual events: Tech conferences and webinars are increasingly held online. These are great opportunities to learn and meet people who might help open doors.

Remember, many job opportunities are never posted online. Your next job could come from a conversation with someone in your network.

4. Focus on Personal Projects

Keep your skills sharp and your portfolio fresh.

If you're job hunting during a tech winter, there's a chance that it might take longer to land your next role. Instead of getting discouraged, use this time to focus on personal projects. Whether you're a programmer looking to showcase your skills or a software engineer honing a new framework, personal projects can provide tangible proof of your abilities to potential employers.

Practical tips for meaningful projects:

Solve real problems: Choose projects that address real-world issues. It could be a tool to automate repetitive tasks or a small app that solves a niche problem.
Contribute to open-source: Platforms like GitHub are home to countless open-source projects that could use your help. This not only improves your skills but also enhances your visibility within the developer community.
Document your work: Build a portfolio that showcases your process. Employers want to see not only your finished product but also your problem-solving approach and how you learn from mistakes.

When job hunting, being able to demonstrate that you've stayed active in the field can set you apart from other candidates.

5. Practice Self-Care

Your mental health matters, too.

Tech winter can take a toll on your mental health, especially if you're job hunting for an extended period. The stress of layoffs, uncertainty, and competition can lead to burnout if you’re not careful. It's essential to prioritize self-care during this time.

Self-care strategies to consider:

Daily exercise: Physical activity is one of the best ways to manage stress. Even a 20-minute walk outside can help clear your mind.
Mindfulness: Practices like meditation or journaling can help keep you grounded. Apps like Calm and Headspace offer guided meditations specifically designed to reduce anxiety and stress.
Limit your social media: Constantly seeing posts about others' success can make you feel behind. Set healthy boundaries with your screen time, especially if you're prone to comparison.

You are not just a software engineer or programmer; you're a whole person. Taking care of your well-being will help you stay resilient in the face of challenges.

6. Strategize Your Job Hunt

A targeted approach is better than a shotgun one.

If you’re job hunting during a tech winter, it’s easy to feel desperate and apply to every position you come across. However, a strategic approach can lead to better results.

Here’s how to streamline your job hunt:

Tailor your applications: Customize your resume and cover letter for each position. Highlight specific skills that align with the job description.
Look beyond big tech: While major tech companies might be hiring less, smaller startups or companies outside the traditional tech sector still need tech talent. Industries like healthcare, finance, and education are increasingly reliant on technology.
Be patient but persistent: Understand that the hiring process may take longer than usual. Don’t get discouraged by silence or rejections. It’s part of the process.

Job hunting is never easy, but being intentional with your efforts can help you avoid frustration and burnout.

Conclusion: Weathering the Tech Winter

A tech winter can feel like a long, cold stretch, but remember, all winters eventually end. As a software engineer, programmer, or job-seeker, focusing on what you can control—your skills, network, mental health, and job-hunting strategies—will help you stay grounded and resilient. The tech industry will rebound, and when it does, you’ll be ready to seize new opportunities.

So, keep learning, stay connected, and above all, take care of yourself. The sun will shine again in the tech world, and you'll be in a stronger position when it does.

Meta Description: Tech winter is tough, but it’s temporary. This guide provides practical tips for software engineers and programmers on staying motivated, job hunting, and maintaining mental well-being during challenging times in the tech industry.

Why JavaScript Is Still Relevant in 2024: A Beginner’s Guide to the OG Webapp King

dwikbtn — Thu, 19 Sep 2024 17:05:37 +0000

Introduction

Ah, JavaScript. The programming language that refuses to go out of style, like that one band from the ’90s that keeps releasing albums no one asked for — but somehow, we keep listening. If you’re new to web development or just curious about why JavaScript is still the thing in 2024, you’re in the right place. So, buckle up and grab your coffee (or energy drink) as we dive into why this scripting language is still ruling the web.

What is JavaScript, Anyway

The MVP of the Web app World

Let’s start with the basics: what the heck is JavaScript? JavaScript is a **programming language **that was originally created to make web pages come alive. You know those fancy buttons that change color when you hover over them? Or that cool infinite scroll on your favorite social media platform? That’s JavaScript at work.

JavaScript allows developers to build interactive, dynamic features on websites. It’s the language that helps your web app go from “meh” to “wow.” And while there are other languages out there that might seem cooler or more cutting-edge, JavaScript is still king when it comes to making the internet work.

Javascript's Comeback Tour

How It Keeps getting Better With Age

Some might say JavaScript has been around forever, but it’s not just sitting on the throne collecting dust. In fact, JavaScript has been going through a serious glow-up, thanks to frameworks like React, Vue.js, and Node.js. These frameworks make it easier for developers to build complex applications with fewer headaches (and fewer lines of code, too).

In 2024, we’re looking at a language that’s not just about simple interactions anymore. JavaScript has evolved into a full-blown ecosystem that can power anything from single-page web apps to server-side programming. It’s like your favorite video game that keeps releasing awesome DLCs — there’s always something new to play with.

Why Beginners Should Love JavaScript

Spoiler: It’s Easy to Learn (Really!)

If you’re new to programming, JavaScript is the language to get your feet wet. Why? Because it’s beginner-friendly and doesn’t throw you into the deep end like some other languages (cough C++ cough). You don’t need a PhD to get started.

For example, with just a few lines of JavaScript, you can write code that makes a website respond to user input. It’s quick, it’s fun, and it gives you that instant dopamine hit when you see it work. Plus, since JavaScript runs in the browser, you don’t need any fancy software to start coding — just open up your browser’s console and you’re good to go!

JavaScript is the low-barrier-to-entry language that gets you building cool stuff fast, and who doesn’t want that?

The Rise of Web apps

JavaScript’s Secret Sauce for World Domination

In case you haven’t noticed, web apps are everywhere. From Gmail to Netflix, many of the services we use daily are powered by web applications. JavaScript is the lifeblood of these web apps, handling everything from user interactions to fetching data from servers.

Without JavaScript, your web app would be about as interactive as a rock. In 2024, JavaScript continues to be the go-to language for building web-based applications because it can handle front-end, back-end, and even mobile app development. It’s like having a Swiss Army knife, except this one doesn’t get lost in your drawer.

JavaScript is Full Stack Now

Front-End, Back-End, All the Ends

JavaScript was once just the language you used to make buttons do cool things on the front-end of a website. But in 2024, it’s taking over the back-end too, thanks to Node.js. This means you can use JavaScript to build an entire application — from the user interface to the server that powers it.

Imagine being able to work on both sides of the equation without switching languages! It’s like being ambidextrous in the coding world. Whether you’re building APIs, web servers, or even desktop apps, JavaScript has you covered. It’s the gift that keeps on giving, no matter which part of the stack you’re working on.

The Job Market Loves JavaScript

Get Paid to Do What You Love

If all this isn’t enough to convince you, let’s talk money. In 2024, JavaScript developers are still in high demand. Why? Because nearly every business out there has a website, and every website needs JavaScript. Whether you’re working at a tech giant or freelancing for small businesses, knowing JavaScript opens a ton of doors.

Plus, with so many frameworks and libraries (hello, React), you can specialize and find a niche that suits your interests. Want to build sleek, modern UIs? Learn React. Want to dabble in server-side development? Dive into Node.js. JavaScript makes it possible to carve out a career that’s as flexible as you are.

The Community That Never Quits

You’ll Never Code Alone

One of the biggest reasons JavaScript is still relevant today is its massive community. Whether you’re stuck on a problem or want to learn something new, there’s always someone (or a thousand someones) who can help. The JavaScript community is welcoming, passionate, and never sleeps — literally, thanks to developers in every time zone.

And let’s not forget about the resources! From endless tutorials to countless free courses, learning JavaScript in 2024 is easier than ever. Got a question? Google it, and you’ll find entire Stack Overflow threads dedicated to your exact issue.

JavaScript Isn’t Going Anywhere

The Future is Still Bright

So, why is JavaScript still relevant in 2024? Because it’s everywhere. From simple websites to complex web apps, JavaScript continues to evolve, making it the go-to language for developers at all levels. Whether you’re just starting out or you’ve been coding for years, JavaScript offers a world of possibilities — without the steep learning curve of other programming languages.

So, if you haven’t already jumped on the JavaScript train, what are you waiting for? It’s a wild ride, and it’s not slowing down anytime soon.

Tailwind tutorial: Make clock/ timer look (in react)

dwikbtn — Thu, 07 Oct 2021 06:56:25 +0000

Hi everyone in this tutorial we will learn how to make wood timer look with only tailwind css.

Tailwind CSS is self-described as a utility first CSS framework. Rather than focusing on the functionality of the item being styled, Tailwind is centered around how it should be displayed. In short by using tailwind you don't need really need to naming each class name.

Your end project will look like this:

you can see the source code here it's working timer. for the working timer maybe we will do in another part.

Install React with tailwind

In this tutorial we're using create-react-app and tailwind

npx create-react-app my-project
cd my-project
npm install -D tailwindcss@npm:@tailwindcss/postcss7-compat postcss@^7 autoprefixer@^9

for config you can see in the official tailwind documentation

Center the div

let's put our app in the center of screen,

<div className="bg-gray-400 min-h-screen flex justify-center items-center flex-col">

</div>

we color the background gray with display flex "justify-center items-center flex-col" part is for center it to x and y axis also we'll make our flex column.

Frame and inside display

//jsx
<div className="timer-frame ">

</div>

@tailwind base;
@tailwind components;
@tailwind utilities;
.timer-frame {
  @apply w-96 h-40 bg-gradient-to-b from-firstGr to-secondGr border-border border-outer rounded-3xl flex flex-row justify-center items-center shadow-2xl;
}

module.exports = {
  purge: ["./src/**/*.{js,jsx,ts,tsx}", "./public/index.html"],
  darkMode: false, // or 'media' or 'class'
  theme: {
    extend: {
      fontFamily: {
        inputText: ["Monoton"],
      },
      colors: {
        border: "#F59D50",
        firstGr: "#EE8C38",
        secondGr: "#F48F32",
        timerBg: "#131514",
      },
      borderWidth: {
        outer: "15px",
      },
    },
  },
  variants: {
    extend: {},
  },
  plugins: [],
};

we separate the time-frame into other css file. I usually long tailwind utility to other file.
for the tailwind config, I put my costume color there. For example:

colors: {
        border: "#F59D50",
        firstGr: "#EE8C38",
        secondGr: "#F48F32",
        timerBg: "#131514",
      },

we use gradient using firstr and secondGr for inside frame, so it's not look boring. for the frame we use utility border with above color. the border has utility "rounded" as it said it make round around the div.

Inside Numbers

<div className="inside-timer">04</div>
<div className="inside-timer">04</div>
<div className="inside-timer">04</div>

@import url("https://fonts.googleapis.com/css2?family=Monoton&display=swap");

@tailwind base;
@tailwind components;
@tailwind utilities;

.inside-timer {
  @apply w-24 h-20 bg-timerBg flex justify-center items-center text-white mx-2 text-5xl tracking-widest font-inputText bg-gradient-to-b from-gray-900 to-gray-800;
}

Maybe you already notice we're using external font you can check the font here.
to use it include it in your tailwind css.

 fontFamily: {
        inputText: ["Monoton"],
      },

Again because we're using inside timer more then once we put it in new css class name and apply it.

we use bg-timerBg utility that black color we added before.