Forem: Sercan GÜNDOĞAN

5 Frontend Tips I Wish I Knew Earlier

Sercan GÜNDOĞAN — Sat, 07 Jun 2025 09:26:30 +0000

Here are a few things I learned the hard way, maybe they’ll save you some time.

Looking back at my frontend journey so far, there are a few simple things I really wish I knew earlier.

They’re not flashy. They’re not from the latest hype cycle.

But they would’ve made everything smoother from writing better code to avoiding burnout.

So here they are 5 tips I’d share with my past self.

Master the Basics Before Jumping to Frameworks It’s tempting to dive straight into React or Vue. But if your JavaScript, HTML, and CSS fundamentals are weak, you’ll struggle more than you need to.

Know how the DOM works. Know how CSS specificity works. Learn vanilla JS deeply.

Frameworks are easier when you understand what they’re abstracting.

You Don’t Need to Learn Everything at Once Trying to learn React, Vue, Angular, and Svelte in one month? I’ve been there.

Spoiler: You’ll just end up confused.

Pick one (I chose React), go deep, and ignore the noise until you’re comfortable.

Depth > breadth when you’re starting out.

You Can (and Should) Learn UX as a Developer You don’t have to become a designer but knowing UX principles makes your frontend work 10x better.

How users read screens
What makes a form intuitive
Why spacing matters
These small UX details are what make your projects feel “polished.”

TypeScript Feels Scary… Until It Saves You I avoided TypeScript for too long. It felt like extra work.

Now I can’t imagine building anything serious without it.

Start small: convert one component.

Then slowly type your functions, props, and API responses.

Your future self (and your teammates) will thank you.

Don’t Overcomplicate Your Code Early on, I thought writing clever code was a flex.

Now I try to write code that’s boring, simple, and obvious.

Readable > clever.

Maintainable > fancy.

Your job is to solve the problem, not impress other devs.

🗣️ What’s One Tip You Wish You Knew Earlier?
I’d love to hear your version.

Drop it in the comments. Whether it’s technical, mindset-related, or just a small trick that made your life easier.

Competitor Intelligence Bot for Social Media Analytics Tools

Sercan GÜNDOĞAN — Fri, 06 Jun 2025 12:10:54 +0000

This is a submission for the Runner H "AI Agent Prompting" Challenge

What I Built

I built a Competitor Intelligence Bot that automates the process of gathering competitive intelligence for Social Media Analytics tools.

As part of the team at Sociality.io, we frequently need to monitor our competitors’ offerings but doing this manually takes hours and is difficult to keep updated.

Using Runner H, I created an AI agent that autonomously collects this information and generates a structured Google Sheet. This saves us significant time and improves the consistency of our competitor research.

Demo

🎥 Video:

👉 Social Media Analytics Tools Competitor Analysis Google Sheet

How I Used Runner H

I provided Runner H with this prompt:

*"Hey Runner H, I want to do a competitor analysis for Social Media Analytics Tools.

Please create a Google Sheet where you collect the following information for each competitor:

Product Name

Pricing (include monthly and yearly plans if available)

Main Features (bullet point list)

Customer Reviews Summary (short paragraph, gather from G2, Capterra or Trustpilot)

Unique Selling Points (bullet point list)

Is a Free Trial Available? (Yes/No)

Here is the list of competitors to analyze:

Sociality.io

Sprout Social

Hootsuite

Buffer

SocialBee

Later

Sendible

Once the Google Sheet is ready, please provide the link here in the chat."*

Runner H autonomously executed this task:

Searched the competitors’ websites

Retrieved relevant review data

Structured everything into a Google Sheet

Provided me with the link, ready to share with my team.

Use Case & Impact

This workflow is already valuable for our internal product and marketing teams at Sociality.io.

Instead of spending hours manually visiting competitor sites and compiling data, we can now get an updated analysis in minutes.

Potential users:

Product managers → to monitor market positioning

Marketing teams → to benchmark messaging and features

Founders / Executives → to quickly understand competitive landscape

Impact:

Time savings → process reduced from hours to minutes

Data consistency → always structured and ready to use

Scalability → can be adapted to any product category easily

Thanks & Final Thoughts

Thanks to Runner H for this great challenge. Excited to explore more AI agent use cases in the future!

How I Stay Up to Date as a Developer (Without Getting Overwhelmed)

Sercan GÜNDOĞAN — Wed, 04 Jun 2025 12:41:15 +0000

You don’t need to chase every trend. Here’s how I stay current without burning out.

As developers, we’re constantly surrounded by new frameworks, libraries, and tools. Every week, something launches. Every month, something changes. And it’s easy to feel like you’re falling behind.

But after a few years in frontend development, I’ve found a rhythm that works for me a way to stay informed without being overwhelmed.

Here’s what I actually do to stay up to date in a sustainable way.

📖 1. I Follow Industry Content on Medium
Medium is my go-to place for high-quality developer content especially opinion pieces, tutorials, and breakdowns of new tech.

I follow topics like:

FrontendDevelopment

ReactJS

WebDevelopment

NextJS

I don’t read every day, but a few posts per week help me stay in the loop without the social media noise.

📬 2. I Subscribe to a Few Targeted Newsletters
Instead of trying to keep up with everything manually, I let newsletters curate content for me.

Some favorites:

Frontend Focus: Weekly roundups of frontend updates
Bytes.dev: A short, fun take on web dev news
TLDR Newsletter: Tech news in small, digestible bullets
React Status: Specific updates from the React ecosystem
I check my email in the morning, scan headlines, and open only what’s relevant.

🚀 3. I Browse Product Hunt for New Tools
I like exploring new tools and platforms, especially in design/dev/productivity.
Product Hunt is where I casually check:

What’s trending
What developers are building
What problems people are solving
Sometimes I discover a new productivity tool or open-source library that ends up in my workflow.

💼 4. I Occasionally Check Job Listings (For Tech Trends)
This one’s a bit unconventional but I sometimes check job postings on sites like:

LinkedIn
Wellfound (ex-AngelList)
Remote OK
Why? Because companies show what skills are in demand.
I look at:

What frameworks are being asked for
What dev tools are trending (e.g., Turbopack, Bun, tRPC)
Which stacks are common in real-world teams
It’s like free market research for my skill roadmap.

🌐 5. I Follow Devs on LinkedIn and Reddit
I follow a few developers and product engineers on LinkedIn they often share:

Insights from the trenches
Cool tools or experiments
Framework news in human terms
And on Reddit, I lurk in:

r/reactjs
r/nextjs
r/webdev
Especially after a new release or big change, these communities have valuable, practical discussions.

🧠 Bonus: I Don’t Chase Everything
This might be the most important part.

I don’t try to learn every new framework. I go deep on what I use (like React + Next.js), and I stay aware of others only if they solve a problem I actually have.

The fear of missing out is real but staying focused and intentional makes me more productive, not less.

✅ Final Thoughts
You don’t need to know everything.

You just need to know what matters to you right now and have a system that keeps you informed without draining your energy.

This is mine. It works. And if you’re feeling overwhelmed, maybe it can help you find your own rhythm too.

🗣️ How do you stay up to date?
Do you use newsletters, blogs, podcasts, YouTube? Drop a comment, I’d love to hear your routine.

What I’d Do Differently If I Were Learning Frontend Development Today

Sercan GÜNDOĞAN — Sat, 31 May 2025 12:51:05 +0000

What I’d change if I had to start my frontend journey over again.

Learning frontend development today is both exciting and overwhelming. There are countless tools, frameworks, and tutorials out there and it’s easy to get lost chasing everything.

I’ve been a frontend developer for 3 years now. I’ve built real projects, made real mistakes, and discovered what actually matters over time.

If I were starting from scratch today, here’s exactly what I’d do differently and what I’d focus on instead.

🎨 1. Learn UX While Learning Frontend
When I started, I was focused entirely on the technical side layouts, components, logic.

What I missed? User experience.

If you want to build good products, you need to understand:

How users interact with your UI
What makes a design intuitive
Why UX decisions impact engagement and retention
I wouldn’t try to become a designer but I’d learn the fundamentals of UX early on. Even just understanding:

Spacing & hierarchy
Form usability
Basic accessibility (a11y)
can make a big difference in the quality of your work.

🔧 2. Choose One Framework and Go Deep
When I first started, I tried learning React, Angular, and Vue at the same time.

Spoiler: I learned none of them well.

If I could go back, I’d pick one probably React (again) and go deep:

Build multiple real projects with it
Understand how routing, state, forms, and data fetching work
Learn how to write clean, reusable components
Get comfortable debugging
Depth > breadth when you’re starting. You’ll learn faster and build confidence quicker.

⚙️ 3. Don’t Skip the Core Fundamentals
I jumped into React too early, without truly understanding:

How the DOM works
How JavaScript handles async behavior
What CSS specificity is
How HTML forms behave by default
If I were learning today, I’d spend more time on:

Vanilla JavaScript
CSS Grid and Flexbox
Semantic HTML
These are the bedrock of every framework, and skipping them leads to shallow learning.

🤖 4. Use AI as a Learning Assistant (Not a Shortcut)
When I started, AI tools weren’t part of the workflow. Today? They’re incredibly helpful.

If I were a beginner today, I’d use ChatGPT or Copilot to:

Explain code I don’t understand
Get help debugging errors
Scaffold repetitive logic
Summarize complex documentation
But I wouldn’t let AI replace learning. I’d still take time to understand what it generates and why.

🧠 5. Focus More on Projects, Not Just Tutorials
Tutorials are safe, but they don’t teach you how to think.

If I were learning again, I’d spend less time watching tutorials and more time building things:

A personal portfolio
A task manager
A weather app using an API
A clone of a product I use
Projects force you to make real decisions and that’s where real learning happens.

✅ Final Thoughts
The frontend ecosystem moves fast, but foundations and real-world thinking always matter most.

If I were learning frontend development in 2025, I’d:

Learn UX alongside code
Pick one framework and commit
Master the basics
Leverage AI as a teacher
Build small, useful projects
That would’ve saved me a lot of time and helped me grow faster.

📣 What About You?
If you’re just getting started, what’s one thing you’re unsure about?

And if you’ve been coding for a while, what’s your biggest “I wish I knew that earlier” moment?

Drop a comment let’s help each other out!

5 Developer Tasks I Completely Offload to AI Now

Sercan GÜNDOĞAN — Wed, 28 May 2025 06:18:10 +0000

As a frontend developer, I used to spend a lot of time researching, comparing tools, and writing repetitive logic. But over the last year, AI has become my second brain. Not just for coding, but for thinking faster and making decisions with more confidence.

Here are 5 tasks I’ve almost completely offloaded to AI in my workflow and why I think it’s a game-changer.

🔍 Researching Concepts, Patterns, or APIs Whether I’m learning about a new library, checking how useEffect behaves in a specific edge case, or exploring architecture patterns, ChatGPT and AI tools help me research 10x faster than scrolling through docs and StackOverflow threads.

Now, I just ask:

“What’s the difference between Zustand and Redux for global state?”
“How should I structure form validation in React using React Hook Form?”
“Explain debounce vs throttle with code examples.”

Within seconds, I get a clean, summarized answer often better than the 7 tabs I used to open.

🧠 Generating Complex Utility Functions Some logic is tedious to write like:

Date formatting
Deep cloning
Debounce and throttle
Custom sorting logic
Now, I just describe the function to ChatGPT, and it writes the initial version for me. Sometimes I tweak it, sometimes it works perfectly out of the box.

It feels like working with a smart junior dev who never gets tired.

⚖️ Comparing Libraries or Tools Choosing between tools used to involve hours of reading GitHub issues, blog posts, and Reddit debates.

Now I ask AI:

“Compare Formik and React Hook Form for a large form-heavy app.”
“Which library is better for charting in React, Recharts or Chart.js?”

It gives me pros, cons, use cases, and even a recommended pick based on my context.

It doesn’t make the decision for me but it gives me clarity fast.

📋 Writing Boilerplate Code or Config Files Setting up a new project?

Creating a basic API call wrapper with Axios?

Configuring ESLint and Prettier for a new repo?

I now use AI to:

Generate common config files (e.g., .eslintrc, tailwind.config.js)
Scaffold utility files
Write initial slices or hooks
It’s not just faster, it reduces decision fatigue.

✍️ Summarizing & Writing Documentation Writing docs used to be painful. Now, I just give AI the component or code and ask:

“Can you generate a README for this hook?”
“Write a usage guide for this API layer.”
“Summarize this component’s purpose and props.”

It gives me a rough draft that I polish but I no longer have to start from scratch.

✅ Final Thoughts
I still write core logic and make the final decisions but offloading repetitive, research-heavy, or boilerplate tasks to AI gives me more time to focus on what really matters: clean architecture, user experience, and solving real problems.

If you’re not using AI in your dev workflow yet, start small. Try it for your next:

Research session
Utility function
README file
You might be surprised how much lighter your day feels.

🗣️ What’s something you’ve offloaded to AI as a dev?
Let’s swap tips in the comments. I’d love to hear what you’re automating.

Why Creativity Still Matters in a World Filled with AI

Sercan GÜNDOĞAN — Mon, 26 May 2025 08:30:43 +0000

We’re living in a time where AI can generate art, music, poetry, code, and even entire websites. As a frontend developer who uses AI tools daily from coding assistants to content brainstormers. I’ve seen how powerful and fast these tools have become.

But the more capable they get, the louder the question becomes:

Is creativity still ours? Or are we just sharing it with the machines now?

🤖 AI Can Replicate… But Can It Create?
AI can remix, analyze, and produce things that look and feel like art. It can write convincing paragraphs, generate UI designs, or suggest clever code solutions.

But I still believe there’s a difference between creation and generation.

AI doesn’t get bored and decide to invent something new.
AI doesn’t suffer a setback and write a song about it.
AI doesn’t walk outside, feel something, and sketch it out for no reason.
That emotional spark, that irrational, personal “why”that’s still ours.

🧠 Creativity Is Evolving, Not Dying
Throughout history, every major leap from the printing press to Photoshop triggered fears that creativity would become mechanical or meaningless. But each time, something new emerged:

New mediums
New styles
New forms of collaboration
Now, AI is just another leap. But this time, it’s not just a tool it’s a co-creator.

And honestly? That’s kind of exciting.

I don’t see AI as a threat to creativity. I see it as a new paintbrush. One that lets us move faster, think bigger, and explore farther than ever before.

⚡ Speed Is Cheap. Depth Is Rare.
Here’s the tradeoff, though.

As AI helps us create faster and more abundantly, speed becomes the norm.

And in that environment, the things that will stand out most aren’t the fastest, they’re the deepest.

Originality. Honesty. Craft.

Creative integrity will matter more than ever, because AI can’t fake lived experience or genuine intention. We, as humans, will have to protect the soul of our work in a world full of perfect, but soulless, content.

💡 So, What Should We Do?
If you’re a developer, writer, artist, or just a curious creator in this AI-augmented world, here’s what I believe:

Use AI as a partner, not a replacement.
Let it help you explore more ideas but choose the one that feels right.
Don’t stop making things because AI can. Create because you can.
Dive deeper. The more shallow content becomes automated, the more value deep, intentional creativity will hold.

✅ Final Thoughts
Will AI challenge what we think of as “creative”? Definitely.

Will it make some things easier or faster to create? Without a doubt.

But will it ever replace the feeling of making something truly original, something that reflects your story, your weirdness, your way of seeing the world?

I don’t think so.

AI may change the canvas, but we still hold the brush.

🗣️ Let’s Keep the Conversation Human
How do you feel about creativity in the age of AI? Have you started using AI in your creative or development work?

Drop your thoughts in the comments. I’d love to hear how you’re navigating this new era.

What I’ve Learned After 3 Years as a Frontend Developer

Sercan GÜNDOĞAN — Thu, 22 May 2025 07:59:06 +0000

Three years ago, I started my journey as a frontend developer. Excited, confused, and curious. Since then, I’ve built real projects, made mistakes, joined a team, launched features, and evolved with the tools and trends.

Here’s what I’ve learned. Not just technically, but also mentally and professionally that I wish I knew from day one.

🎯 Focus Beats Curiosity When It Comes to Tech At the start, I tried to learn React, Vue, and Angular all at once thinking I had to know everything to be “good.”

But eventually, I realized: depth beats breadth.

Now, I’ve chosen React as my core tool and I continuously deepen my understanding of it while ignoring the pressure to chase every new trend.

🧱 Fundamentals Are Everything You can’t truly understand frameworks without knowing the basics of HTML, CSS, and JavaScript. I skipped these early on, and it made working with frameworks more confusing than it needed to be.

Now I always recommend: start with the basics, then build upward.

🤖 Use AI as Your Pair Programmer In my early days, Stack Overflow was my second home. Now? ChatGPT, Cursor, and Copilot are part of my daily workflow.

I use AI to:

Debug errors
Generate utility functions
Review code
Speed up documentation
Learn unfamiliar concepts
But AI is a tool, not a crutch. You still need to understand and review what it gives you.

⌛ TypeScript is Worth the Effort I adopted TypeScript late and I wish I had started earlier. It felt overwhelming at first, but now it saves me from bugs, improves readability, and makes my codebase more scalable.

My advice? Start using TypeScript slowly, but stick with it. It’s a long-term win.

🧠 Tools Are Cool, but Mindset Matters More I’ve tried dozens of tools: Figma, Notion, VSCode, Todoist, Postman, Sentry, and more. But the real progress came from changing how I approach problems.

What matters most:

Clear thinking
Clean code
Consistency
Communicating with your team

🛠️ Simpler Code Is Better Code
Early on, I overengineered everything. I thought writing complex abstractions made me smart.
Now, I know: simple, readable code is the best code.
⚡ Side Projects Are Not Just About Code
I used to think I could build a product alone just by coding fast. I learned the hard way that:

UX matters
Marketing matters
Validating ideas early matters
Solving real problems matters more than just “building something cool”

🧠 User Experience Should Be Every Frontend Dev’s Concern Even if you’re not a designer, learning UX basics will help you:

Build better interfaces
Collaborate better with designers
Avoid usability mistakes early
It’s not about becoming a designer it’s about becoming a better developer.

🚫 Don’t Work on Too Many Things at Once I tried juggling multiple side projects, hoping one would “work.” In reality? Spreading myself too thin led to burnout and unfinished work.

Now, I try to focus on one project at a time, give it my full attention, and iterate.

🧩 Soft Skills Matter More Than You Think It’s not just about writing code.

Communication, teamwork, giving feedback, and understanding product context are all crucial to being a well-rounded developer especially in a team.

✅ Final Thoughts
Three years in, I’m still learning every single day. But these are the lessons that have stuck the ones I didn’t learn from tutorials or documentation, but from real work, real mistakes, and real growth.

If you’re just starting out, I hope this helps. And if you’ve been in the game for a while let’s compare notes!

The Ultimate React Folder Structure I Use as a Frontend Developer

Sercan GÜNDOĞAN — Wed, 21 May 2025 07:57:01 +0000

As a frontend developer, having a consistent and scalable project structure helps me stay productive and maintain code quality. Here’s a breakdown of how I structure my React projects using Vite, TypeScript, Tailwind CSS, and modern tools like ESLint, Prettier, and Docker.

📁 Folder Structure Overview
Here’s a typical folder structure I use:

/public → Static assets like images, icons, SVGs

/src
├─ @types/ → Global TypeScript declarations
├─ components/ → Reusable UI components
├─ constants/ → Static configuration or key-value constants
├─ data/ → Static or mock data
├─ features/ → Feature-based modular folders (e.g. auth, dashboard)
├─ fonts/ → Custom fonts (if any)
├─ hooks/ → Reusable custom React hooks
├─ i18n/ → Internationalization logic
├─ pages/ → Route-level components
├─ routes/ → App route definitions
├─ services/ → API calls or service functions
├─ store/ → State management (Redux, Zustand, etc.)
├─ types/ → Local shared types
├─ utils/ → Utility/helper functions
├─ App.tsx
└─ index.css

Root
├─ .env → Environment variables
├─ .env.example → Template for environment variables
├─ .eslint.rc → ESLint config
├─ .prettierrc → Prettier config
├─ tailwind.config.js → Tailwind config
├─ tsconfig.json → TypeScript base config
├─ tsconfig.node.json → Extended config for tools
├─ vite.config.ts → Vite config
├─ dockerfile → Docker setup
├─ docker-compose.dev.yml → Docker services (e.g., backend, db)
├─ yarn.lock / package-lock.json
⚙️ CI/CD & Tooling Setup
✅ Linting & Formatting
ESLint with TypeScript & React plugins for code quality.
Prettier for consistent formatting.
Husky for Git hooks (e.g., lint before commit).
EditorConfig to maintain consistency across editors.
🚀 CI/CD
GitHub Actions (or similar) for:
Build checks
Lint checks
Deployment (e.g., Vercel, Netlify, or Docker container build)
🌍 Environment Management
.env and .env.example are included at the root.
Used for:

Base URLs
API keys
Feature flags
Never commit sensitive .env files, use .gitignore.

🧱 Folder Naming Conventions
Plural folders for grouping: components, hooks, services.
PascalCase for components (LoginForm.tsx), camelCase for files like hooks/utilities (useAuth.ts, formatDate.ts).
Feature folders are self-contained:
/features/auth/
├─ AuthForm.tsx
├─ authService.ts
├─ authSlice.ts
🐳 Docker Support
Dockerfile and docker-compose.dev.yml make local setup easy.
Useful when you want to standardize dev environments across machines or collaborate with backend teams.
🔧 Tailwind + PostCSS + Vite
tailwind.config.js and postcss.config.js are at the root.
Vite ensures blazing fast dev builds and a simpler setup compared to CRA or Webpack.
✅ Why This Structure?
Modular: Easy to maintain, even as the app scales.
Consistent: Clear naming and separation of concerns.
Team-friendly: Easy for others to contribute without confusion.
Deployment-ready: CI/CD + Docker + env support included.
This structure has evolved over time with real-world experience. While there’s no one-size-fits-all, this approach works great for mid-to-large scale React projects using modern tooling.

🚀 Ready to Improve Your React Setup?
If you found this structure helpful, consider giving it a try in your next project.

Have a structure you swear by? Or want feedback on your current setup?
Let’s chat in the comments

Image credit https://undraw.co/

How to Find Great Side Project Ideas (That Actually Matter)

Sercan GÜNDOĞAN — Tue, 20 May 2025 15:27:23 +0000

As frontend developers, we often feel the urge to build something on the side whether it’s to learn, earn, or simply create. But most of us get stuck at the very first question: “What should I build?”

Here are some practical ways (including my own experiences) to find meaningful side project ideas that are worth your time.

🎯 Start With What You Know You’re already an expert in something. Maybe it’s frontend development, design workflows, finance, or a niche hobby. That’s your edge. Why? Because:

You know the pain points better than outsiders
You can build faster since you understand the space
You’ll be more motivated to solve problems you care about
Tip: Think of the daily frustrations you face others are probably facing them too.

🧠 Focus on Problems, Not Competitors Many developers get caught up in building what others are building. But the key is to solve real user problems, not copy existing tools with small tweaks.

Ask yourself:

Does this idea solve a real, felt need?
Would someone pay for it or use it regularly?
You’re not building a better version of something you’re offering a solution that matters.

🎯 Niche Down The smaller and more specific your target audience, the easier it is to serve them well. Instead of trying to build a task app for “everyone,” make one just for:

Freelancers
Frontend developers
Teachers, etc.
Niches = Clarity. You’ll know who you’re building for and how to speak to them.

✅ Validate Before You Build Before writing a single line of code:

Share your idea with friends or online communities
See if others experience the same pain
Create a landing page or waitlist
Ask people if they’d pay for it
Validation doesn’t mean a survey it means real interest.

👀 Observe People & Ask Questions Great ideas often come from listening. Ask people around you:

What’s the most annoying thing about your job?
What’s something you wish existed?
What tool do you use that frustrates you?
Then just… listen. Problems are everywhere.

✨ Stay Curious and Document Everything Keep a running list of:

Tools you wish existed
Manual processes you repeat often
Frustrations from your daily workflow
Eventually, one of those notes will become your next project.

🤖 Use AI to Explore and Validate Faster Use tools like ChatGPT to:

Brainstorm variations of your idea
Analyze potential markets
Generate MVP feature lists
Even help build the first version
Leverage AI as your co-founder, not just your assistant.

🧠 Final Thoughts
You don’t need to build something big. You just need to solve something real.

And the more real the problem is, the more people will care.

How to Find Great Side Project Ideas (That Actually Matter)

Sercan GÜNDOĞAN — Tue, 20 May 2025 15:27:23 +0000

Here are some practical ways (including my own experiences) to find meaningful side project ideas that are worth your time.

🎯 Start With What You Know You’re already an expert in something. Maybe it’s frontend development, design workflows, finance, or a niche hobby. That’s your edge. Why? Because:

🧠 Focus on Problems, Not Competitors Many developers get caught up in building what others are building. But the key is to solve real user problems, not copy existing tools with small tweaks.

Ask yourself:

Does this idea solve a real, felt need?
Would someone pay for it or use it regularly?
You’re not building a better version of something you’re offering a solution that matters.

🎯 Niche Down The smaller and more specific your target audience, the easier it is to serve them well. Instead of trying to build a task app for “everyone,” make one just for:

Freelancers
Frontend developers
Teachers, etc.
Niches = Clarity. You’ll know who you’re building for and how to speak to them.

✅ Validate Before You Build Before writing a single line of code:

👀 Observe People & Ask Questions Great ideas often come from listening. Ask people around you:

What’s the most annoying thing about your job?
What’s something you wish existed?
What tool do you use that frustrates you?
Then just… listen. Problems are everywhere.

✨ Stay Curious and Document Everything Keep a running list of:

Tools you wish existed
Manual processes you repeat often
Frustrations from your daily workflow
Eventually, one of those notes will become your next project.

🤖 Use AI to Explore and Validate Faster Use tools like ChatGPT to:

Brainstorm variations of your idea
Analyze potential markets
Generate MVP feature lists
Even help build the first version
Leverage AI as your co-founder, not just your assistant.

🧠 Final Thoughts
You don’t need to build something big. You just need to solve something real.

And the more real the problem is, the more people will care.

What Were My Biggest Mistakes as a Frontend Developer?

Sercan GÜNDOĞAN — Mon, 19 May 2025 15:01:15 +0000

As a frontend developer, I’ve made a fair share of mistakes and I believe they helped me grow. In this post, I want to openly reflect on the biggest ones, in hopes that they can guide someone else who’s on the same path.

🚫 1. Trying to Learn Everything at Once
I thought I needed to learn React, Angular, and Vue all together. That led to confusion and burnout. Eventually, I focused only on React not because it’s the best, but because depth matters more than breadth. Mastering one tool is better than being average in many.

🔁 2. Not Learning the Fundamentals First
I rushed into frameworks without understanding HTML, CSS, and JavaScript properly. That made things harder. Frameworks change, but core web technologies stay the same learn them first, always.

⌛ 3. Learning TypeScript Too Late
Once I started using TypeScript, I realized how much it improves the development process. If I could go back, I’d learn it earlier to catch errors faster and write better-structured code.

🧑‍💼 4. Trying to Build Side Projects Alone and Fast
I thought just coding quickly would lead to success. But building a side project involves UX, marketing, and user feedback too. Coding is only one part of the puzzle.

🔀 5. Working on Too Many Projects at Once
I tried juggling multiple side projects to increase my chances of success but ended up making none of them truly great. Focus wins over volume.

📉 6. Neglecting User Experience
UX isn’t only for designers. As frontend devs, we create interfaces. Learning the basics of UX helped me collaborate better and build more user-friendly products.

📚 7. Not Reading Documentation Thoroughly
I used to rely too heavily on YouTube or StackOverflow instead of going straight to the docs. Documentation is the best source of truth and helps you understand tools the right way.

🛠️ 8. Overengineering Simple Things
Early in my journey, I used overly complex solutions just to seem “smart.” Now I’ve learned: clean, simple code is more scalable and readable.

⚡ 9. Ignoring Performance and Accessibility
I didn’t care much about performance, accessibility, or even mobile responsiveness until I realized they directly impact the user. These things matter more than clever animations.

💬 10. Neglecting Soft Skills
Being a great dev isn’t just about writing code. Communicating clearly, understanding team dynamics, giving and receiving feedback these skills are just as important.

✅ Final Thoughts
Every developer makes mistakes, and that’s okay. The goal isn’t to avoid them all, but to reflect, improve, and help others through what you’ve learned. Growth takes time and that’s part of the journey.

Image credit https://undraw.co/

Chrome Extensions I Use as a Frontend Developer

Sercan GÜNDOĞAN — Sat, 17 May 2025 11:07:06 +0000

As a frontend developer, I’m always looking for tools that help me work faster, debug smarter, and design more efficiently. Chrome extensions are one of the most underrated ways to improve your workflow. Many of them save me minutes (or even hours) every single week.

Here are the Chrome extensions I personally use and recommend, along with how I use them:

⚛️ React Developer Tools
React Developer Tools Chrome Web Store

An absolute must-have if you’re working with React. It lets you inspect the React component tree, see props and state at a glance, and even track changes. Super useful for debugging and understanding how everything fits together in a React app.

🧠 Redux DevTools
Redux DevTools Chrome Web Store

If your app uses Redux, this extension is gold. You can see every action, state change, and even time-travel through your app’s history. I use it regularly to spot logic issues or confirm my state is updating correctly.

🎨 Eye Dropper
Eye Dropper Chrome Web Store

Sometimes, I just need to grab a specific color from a webpage and this does exactly that. Whether it’s for matching a button or pulling a shade into Figma, this tool is quick and accurate.

📏 Page Ruler
Page Ruler Chrome Web Store

Helps me measure pixel-perfect distances between elements right on the page. Perfect when aligning things visually or double-checking spacing that feels “off” but you can’t explain why.

🔍 JSON Viewer
JSON Viewer Chrome Web Store

Neatly formats JSON responses in your browser. I use this a lot when testing APIs or looking at complex response structures.

Working with APIs means you see a lot of JSON. This extension makes raw JSON readable collapsible, color-coded, and easy to scan. A simple tool that removes friction from everyday development.

🔍 Wappalyzer
Wappalyzer Chrome Web Store

I use this out of curiosity and research. Wappalyzer shows what tech stack a site uses frontend frameworks, analytics, CMS, fonts, and more. It’s great when you stumble upon a cool site and wonder, “What are they using?”

🚦 Lighthouse
Lighthouse Chrome Web Store

Technically it’s in DevTools already, but the extension lets you run audits even faster. I use Lighthouse to check my app’s performance, SEO score, accessibility, and best practices. It’s a great way to get a health check before deploying.

🧠 Final Thoughts
These extensions are part of my daily workflow. You don’t need to install them all at once but if any of the problems above sound familiar, give the related extension a shot.

Got any favorite Chrome extensions of your own? Drop a comment, I’m always open to trying something new.

Let me know if you’d like a custom thumbnail, intro line for Medium, or suggested hashtags/topics for this post!

Illustration by unDraw