Introducing @harshil3134/utils: Type-Safe, Zero-Dependency Utility Library

Class-03 'Laying the foundation' from the Namaste React course by Akshay Saini 🚀 #01. We got introduced to JSX: 1. He is breaking the myth that, JSX is not HTML inside Js. 2. JSX is HTML-like or XML-like syntax. JSX stands for JavaScript XML. It's a syntax extension for JavaScript. 3. It is not a part of React. React apps can be built even without JSX but the code will become very hard to read. 4. JavaScript engine cannot understand JSX as it only understands ECMAScript. 5. Using curly braces {} inside JSX, we can write Js expression inside it. #02. Babel introduction: 1. Babel is a package, one of the dependencies of Parcel, where parcel allocates this work to Babel. 2. Browsers cannot understand JSX, here comes babel JSX is transpiled before goes to browser engines. The flow goes like this until reaches the browser: JSX (transpiled by Babel) -> React.createElement -> ReactElement (is an Js object) -> HTML Element (Browser understand this and render) #03. Introducing React components: 1. Class-based Components - Old way of writing code, used rarely in industry 2. Functional Components - New way of writing code, most commonly used. #04. Components composition: A component inside a component. Calling a component inside another component is called component composition. Thanks Akshay Saini 🚀 for breaking down complex concepts into small chunks for better understanding! 🙏 Please have a look at my github repo at the 'branch 03' I've shared all my assignments. #frontend #uideveloper #reactjs #programming #javascript #jsx #coding #uiux https://lnkd.in/g6Dt-SuA

I finally tried Bun JavaScript runtime... and it made me realize how much friction I had normalized in my workflow. When starting a TypeScript project in the Node.js runtime ecosystem, I’m used to doing a few setup steps first: - Initialize the project with npm init - Install TypeScript and Node type definitions - Generate tsconfig.json - Install a tool like tsx to run .ts files without compiling - Install nodemon to restart the server on file changes - Configure scripts in package.json - Finally run the project with npm run dev All that… just to execute a .ts file. With Bun, my experience was basically: $> bun init $> bun run index.ts And I immediately saw “Hello via Bun!” in the console. My reaction was literally: “Wait... it’s really that easy?” After browsing the docs a bit, I was even more impressed. Bun ships with a lot of useful tools and utilities baked in that I normally install separately when working on my Typescript projects. Sometimes you don’t realize how much friction you’ve accepted... until you try something simpler. #JavaScript #TypeScript #DeveloperTools #Nodejs #Bun

After iterating on earlier versions, I’ve just released v1.0.0 of ts-package-init. It’s a minimal TypeScript CLI project initializer for Node.js, designed to avoid the usual boilerplate overload. Most TypeScript starters I tried were either: • too heavy • too opinionated • or filled with configuration I didn’t need So I built something focused on: ✔ Zero-config TypeScript setup ✔ Clean presets (library, backend, CLI, monorepo, NestJS, Moleculer) ✔ Optional ESLint & Prettier ✔ ESM or CommonJS support ✔ Node 18+ ready The goal is simple: Start fast. Keep it minimal. Add complexity only when necessary. If you regularly spin up TypeScript projects, I’d love feedback from real-world usage. npm: https://lnkd.in/dh-DgaWD Github: https://lnkd.in/dzJvZNSy #typescript #nodejs #opensource #cli #developerTools

107 downloads in 12 hours 🧙♂️ A few hours ago I announced date-wiz — my open-source TypeScript date utility library. Today I’m sharing the first real milestone: 107 downloads in the first 12 hours after publishing to npm. Small number? Maybe. But it means real developers installed something I built from scratch — and that matters a lot to me. 🔧 What makes date-wiz different: • Zero runtime dependencies — purely native Date and Intl APIs • Under 2 KB gzipped — lighter than Day.js, far lighter than Moment.js • TypeScript-native — full type safety, no @types/ package needed • Tree-shakable ESM — import only format() and ship ~1.2 KB • Business day logic built-in — no plugins • Smart formatting — "Today at 4:30 PM", "Yesterday at 11 AM", "Oct 12, 2022" • Intelligent parsing — understands +2d, next_monday, 15-05-2024 with no format string • Full i18n — 100+ locales via native Intl, zero locale files bundled • 107 tests, 100% function coverage I also built a full documentation site with Astro + Starlight — complete API reference, guides, React/Next.js examples, and more. If you work with dates in JavaScript or TypeScript, I’d love for you to try it and share your feedback. 📦 npm → npmjs.com/package/date-wiz 📖 Docs → https://lnkd.in/gSNHBwqU 🐛 Issues / PRs welcome → https://lnkd.in/gfryWutd #TypeScript #JavaScript #OpenSource #npm #WebDevelopment #SoftwareEngineering

Last weekend, I dedicated time to create a new boilerplate using React, inspired by an older version called "React Boilerplates." I appreciate the folder structure and the way the components interact, so I made some updates to the libraries for a more modern approach. Here are the key changes and additions: - Replaced Redux with Zustand - Updated from TailwindCSS v4 to Shadcn - Switched React Hook Form to Zod validation - Implemented standard-version for release versions - Utilized Vitest for unit testing - Created a simpler project setup and teardown script example Looking ahead, I may add the following features: - MSW mock REST API, SSE, and WebSocket - TRPC - CLI to scaffold the project and additional generators You can find the GitHub repository here: https://lnkd.in/gBnYVedj.

Today I published my first npm package and learned more in 2 hours than I expected. Here's what actually happens when you run npm publish for the first time — the parts no tutorial tells you: 1. The bin field is not forgiving If your package.json bin path is slightly off, npm silently removes it at publish time. Your CLI command just vanishes. The fix is always a #!/usr/bin/env node shebang on line 1 of your entry file. 2. npm normalizes your repo URL whether you like it or not Write https://github.com/... and npm rewrites it to git+https://github.com/....git. Just write it the normalized way from the start. 3. .npmignore is not optional if you care about package size Without it, npm falls back to .gitignore — which is fine but imprecise. A proper .npmignore keeps dev files, test files, and config out of the published tarball. 4. Name availability is a real constraint My original name was taken. Lesson: check npmjs.com before you build, not after. 5. npm pkg fix is your friend Run it before publishing. It catches schema errors in package.json that will cause warnings at publish time. The whole process from zero to published took under 30 minutes once the code was ready. If you've built a Node.js tool and haven't published it yet — just do it. The barrier is lower than it looks. 📦 My package: npmjs.com/package/tunnelup #npm #nodejs #opensource #learninpublic #javascript #webdevelopment

I'd like to introduce my first npm package, pagination-core, which I built a few months ago. After working with several pagination libraries, I kept running into the same issue: many of them lock you into a specific UI framework or come with heavy dependencies. So I built pagination-core — a headless pagination library that focuses purely on logic, not UI. Why pagination-core? - UI-agnostic: Works with React, Vue, Svelte, or plain Vanilla JavaScript. - Headless by design: You have full control over how the UI looks and behaves. - Zero dependencies: No unnecessary packages and no dependency conflicts. - TypeScript-first: A clean API with full type safety. The goal is simple: provide a lightweight foundation for pagination logic without locking developers into any particular framework. The project is open to contributions, and I’d love to hear your thoughts or feedback. 🔗 GitHub: https://lnkd.in/dpf7daJC I’m also experimenting with ways to ensure that AI coding agents — which now handle many package installations — can easily discover and recommend the library. #opensource #javascript #typescript #frontend #webdevelopment

🚀 Day 32 of Learning in Public: JavaScript Edition 💻✨ Just spent some time into basics of Node.js and npm today🔥 Here’s everything I learned and neatly noted down 👇: What I covered today: • Node.js = JavaScript’s runtime outside the browser • npm = The official Node Package Manager (basically the heart of every JS project) • node -e "code" → Quick one-liner execution in terminal • npm init → Creates package.json (the brain of your project) • node_modules/ → Where all packages get downloaded (never push this to Git!) • package.json → Manages dependencies + scripts + entry point • package-lock.json → Locks exact versions so your team gets the same packages every time 🔒 npm i <package>     → Production dependency (goes in "dependencies") npm i <package> -D    → Development-only (goes in "devDependencies") npm init npm install --production npm list --depth0 npm i <package_name> --save -dev #NodeJS #npm #JavaScript #Backend #LearningInPublic

I selected the "Cleaner & polished" variant and made some edits. Here's the message: Yesterday I typed "npm publish" for the first time. And honestly? It felt amazing. I've been learning Node.js by building CLI tools. Instead of stopping at tutorials, I decided to actually ship something — a CLI tool that prints a random inspirational quote right in your terminal. Will it get thousands of downloads? Probably not. Did I learn more from this one small project than hours of tutorials? 100%. Here's what I picked up along the way: → Structuring a CLI tool with Node.js → How the bin field in package.json actually works → The full npm publishing flow — scoping, versioning, 2FA, all of it Want to try it? npm install -g @amitjha17/quote-cli This is project 1. More coming soon. Follow along if you want to see what I build next. #nodejs #npm #javascript #webdevelopment #buildinpublic #learninpublic https://lnkd.in/dux7zva8

Another business gap I think I've found I was trying to install a single npm package. I got this: ERESO LVE. Peer dependency conflict. A wall of red text telling me that two packages in my project need different versions of the same dependency, and npm doesn't know which one to pick. We've all been there. You're not even doing anything complex. You just want to add a package and get back to building. So instead of copy-pasting the error into Google for the 100th time, I built a small tool: npm-safe. Here's what it does: → Runs npm install normally → If it hits an ERESOLVE, it parses the error output directly → Explains in plain English what's actually conflicting and why → Suggests concrete fix commands, ordered from safest to most aggressive → Asks if you want it to auto-fix, and walks through each strategy one by one Still debugging, but already shipped. Link in the comments 👇 #opensource #nodejs #npm #devtools #javascript #dx