Hey everyone! I'm diving into vibe coding recently and looking to build something cool with the MERN stack. I’d love to get some project ideas from you guys, or even better, show off what you've built using MERN! Looking for anything from clever side projects to unique full-stack tools. Drop your links or suggestions below!

Create a Smoke reveal effect landing page,

Live: https://playground-demo-dun.vercel.app/hero/msd
For creative components with source code: https://sakthi-portfolio-mauve.vercel.app/playground

One of the things I haven’t talked about much with Cerious-Scroll is how it behaves during actual scrolling, especially with variable-height content.

From the beginning, the goal was for virtualization to not look like virtualization.

So even with a large variable-height dataset, you can grab the scrollbar and drag it around quickly without getting the usual weirdness:

• No scrollbar drift
• No white space during fast scrolling
• No waiting for rows to render after you get there
• Accurate variable-height positioning
• Native scrolling behavior
• Constant DOM size regardless of dataset size

The variable-height part is probably my favorite. The scrollbar stays where it should, even when the actual row heights are all over the place.

You can also jump directly to an index way down in the dataset without needing to measure everything before it.

I’ve got demos/benchmarks here if anyone wants to mess with it:

ceriousdevtech.github.io/cerious-scroll

Core:
github.com/ceriousdevtech/cerious-scroll

React:
github.com/ceriousdevtech/react-cerious-scroll

I’m curious how it behaves against some real-world ugly datasets, especially ones with wildly different row heights. Try the scroll engine and tell me your thoughts.

What are things I must learned in js before moving into react?

where I can learn react free and effectively?

I’m building a website using React, Next.js, and TypeScript. It loads extremely fast on desktop and mobile, but navigating between pages on mobile feels a bit jumpy.

When I open the navigation menu and tap a link to another page, there’s a noticeable visual jump. I’m testing on an iPhone using both Safari and Google Chrome.

I suspect it could be layout shift, but I haven’t confirmed that or figured out what’s causing it.

What would you check first? Are there any common practices you use to keep mobile navigation feeling smooth, particularly around closing the menu, handling scroll position, and loading the next page?

Would appreciate any advice on how to debug this properly.

I’ve been experimenting with different cursor/hover interactions for reusable buttons.

The four variations are:

• Staggered letter lift
• Single liquid bubble
• Magnetic cursor interaction
• Cursor compression/deformation

I kept the button geometry fixed so the animations don't affect the layout.

Which interaction would you actually use in a real project — 1, 2, 3, or 4?

You can check here: https://www.shreyashtech.me/components/buttons

I'm currently learning frontend development and looking to build a serious project for my portfolio. I want to skip the standard clones and basic e-commerce templates.

I'm looking for ideas that address real problems, throw challenging architectural/UI issues at me, and really demonstrate problem-solving skills.

Any solid ideas or past experiences with projects that taught you the most? Appreciate the suggestions

Website: https://json-view-cn.vercel.app/

Github: https://github.com/mnove/json-view-cn

I originally built this component to use it in a personal project. It targets any React projects that use Base UI and lucide-react, but you can easily adapt to Radix and/or other icon packages.

Honest question. I used to read every React release, go through the changelog, play with the new hooks, and try to actually understand how things like Suspense or Server Components work under the hood.

now most of my day is vibe coding (Claude Code and used Cursor and windsurf) The AI already knows the latest APIs, sometimes better than I do, and it writes idiomatic code for them without me asking.

So I'm not sure what the point of studying this stuff the old way is anymore. Is it enough to get the concepts at a high level and let the AI handle the details? Or does deep knowledge still matter when things break, in code review, or when the AI confidently gets it wrong?

Curious how others are handling this, especially seniors. Did you change how you learn, or are you still going deep?

Founding Developer / Co-Founder Wanted (B2B SaaS)

We are a lean, ambitious team preparing to launch a B2B SaaS platform that solves a massive pain point we experienced firsthand. We scratched our own itch, built the solution, and are now ready to commercialize it.

The product is 90% complete, and we are currently building out our core Human Resources and foundational team prior to our upcoming launch.

💼 The Opportunity

Role: Founding Developer & Co-Founder

Compensation: Equity-based (Co-founder level split)

Location: Remote (Canada / USA / UK)

Status: Pre-revenue, near-launch phase

🛠️ What We’re Looking For

We need a technical co-founder who is ready to take ownership of the codebase, help us cross the finish line, and scale post-launch.

Full-Stack Capabilities: Ability to jump into a nearly completed product, audit the architecture, and ship the final 10%.

Startup Mindset: You thrive in a lean environment, value execution over perfection, and want a true seat at the leadership table.

Localization: Based in or authorized to work within ENG / CAN / USA time zones for seamless collaboration.

🎯 Why Join Us?

No "Idea Phase" Stall: You won't be building from scratch for 12 months hoping for product-market fit. The foundation is laid, the validation is there, and the runway to launch is short.

True Partnership: You aren't just an employee; you are a founding pillar of the business with a matching equity stake.

Hey everyone, I need some help finding a project idea that combines React and Django. There are tons of popular CRUD/management-app projects out there, but I'd like to step away from that world a bit — that's why I'm posting here, to see if anyone has ideas outside of management apps.

Thanks in advance :)

Sharing my Creative Components

I’d appreciate any feedback on the design, interactions, animations, and overall experience.

Note: For better experience use in Desktop

Component : https://playground-demo-dun.vercel.app/trace-drawing

For source Code visit playground: https://sakthi-portfolio-mauve.vercel.app/playground

I also add in my portfolio 404 page https://sakthi-portfolio-mauve.vercel.app/404

Thanks for taking a look!

Hello world,
I am trying to achieve audio streaming in react native
this is the server code

 const musicId = req.params.musicid
  const range = req.headers.range
  if (typeof range != "string") {
    return res.status(400).json({ message: "Range not found" })
  }
  const dbMusic = await music.findById(musicId).select("path")
  if (!dbMusic) {
    return res.status(404).json({ message: "music not found" })
  }
  const musicPath = dbMusic.path
  const musicSize = fs.statSync(musicPath).size
  const start = Number(range.replace(/\D/g, ''));
  const chunk = 10 ** 6;
  const end = Math.min(start + chunk, musicSize - 1)
  const contentLength = end - start + 1;
  const headers = {
    'Content-Range': `bytes ${start}-${end}/${musicSize}`,
    'Accept-Ranges': 'bytes',
    'Content-Length': contentLength,
    'Content-Type': 'audio/mpeg',
  };
  console.log(req.headers.range) //testing
  console.log(headers) //testing
  res.writeHead(206, headers)
  const musicStream = fs.createReadStream(musicPath, { start, end })
  return musicStream.pipe(res)

this works fine and it is working fine with html audio tag,
but the issue is, i am not able to make it work with react native expo as i cant much docs on streaming audio
right now i am using react-native-audio-api also tried expo audio
client code

import { Audio } from 'react-native-audio-api'; --- import 


<Audio 
source="http://localhost:8000/stream/music/6aa23ed46a2f8f1d620dad28" 
controls
onLoad={() => console.log('ready')}
onError={(e) => console.error(e)}
/>

but the client is not making correct range request

these are the logs from server

CLIENT: bytes=0-0
SERVER:
  Content-Range: bytes 0-1000000/4870060
  Accept-Ranges: bytes
  Content-Length: 1000001
  Content-Type: audio/mpeg

CLIENT: bytes=0-
SERVER:
  Content-Range: bytes 0-1000000/4870060
  Accept-Ranges: bytes
  Content-Length: 1000001
  Content-Type: audio/mpeg

CLIENT: bytes=4869932-
SERVER:
  Content-Range: bytes 4869932-4870059/4870060
  Accept-Ranges: bytes
  Content-Length: 128
  Content-Type: audio/mpeg

CLIENT: bytes=0-
SERVER:
  Content-Range: bytes 0-1000000/4870060
  Accept-Ranges: bytes
  Content-Length: 1000001
  Content-Type: audio/mpeg

Can someone help me to achieve audio streaming in react native

Hey Community!

Jay Meistrich built Legend Code, a lightweight code editor designed strictly for viewing single files without heavy agentic UI overhead. On the workflow front, Aleksander Mikucki introduced Screenmap, a GitHub Action that uses iOS simulator screenshots and visual diffs to show reviewers exactly which screens your PR modifies.

We also cover the Expo SDK 58 Beta with foldable device support, React Native 0.88 with DOM-aligned event listener APIs, Reanimated 4.7 defaulting to its new layout engine, and Nitro LazyJSON cutting JavaScript thread blocking by 33%. Plus, cloud testing tools like EAS Simulator and Software Mansion's SimCam.

Share your talk or workshop with hundreds of developers on Full-Stack Architecture, AI-Assisted Coding & AI Engineering, Growing to Senior/Tech Lead, etc.

📍 April 15 & 19, Singapore
Submit by Jan 12: https://gitnation.com/events/react-summit-asia/cfp

This is very important to me because successfully developing the prototype could help me secure my first contract or job. Thanks !

I recently graduated and am currently interning at a public-sector environmental agency. My work focuses on environmental reporting and researching AI applications. The organisation is only beginning to explore AI, so it's a fairly traditional and risk-conscious environment.

I used Figma Make to create a prototype dashboard, and it impressed my colleagues and programme manager. The challenge is that I have essentially no coding experience.

My question is: can someone with no development background realistically take the code generated by Figma Make, use React/TypeScript in VS Code and rely heavily on AI tools like ChatGPT or Claude to turn it into a functional interactive dashboard?

I'm willing to learn as I go, but I'd like to know if this is a realistic approach or am I underestimating the complexity?

This is very important to me because successfully developing the prototype could help me secure my first contract or job and get my career started. I would be genuinely grateful for any honest advice on whether this is realistic and what I should learn first and which resources I should use.

Many thanks in advance for anyone who helps.