How to Publish Your First NPM Package and Change the World

🚀 Last week’s learning recap: I explored Git & GitHub, diving into commands like push, pull, merge, rebase, commit, clone, and fetch — and learned when (and when not) to use them. A key takeaway: only rewrite commit history on repos you personally own. I practiced using learngitbranching.js.org — such a great resource! I also started learning ShadCN UI, and realized how much a well-structured CSS setup and clean React components matter when building organized, scalable frontends. 💬 How do you approach frontend planning and architecture when starting a new project? Here’s a look at my progress 👇 #LearningInPublic #DeveloperJourney #WebDevelopment #Programming #TechCommunity #JuniorDev

Want to make your project live in minutes? With GitHub Pages, deploying your website or portfolio has never been easier, no complex setup, no hosting fees, just push your code and go live. It’s the perfect tool for developers who want to showcase projects, test ideas, or share documentation straight from their GitHub repo. So, next time you finish a build, skip the hassle and let GitHub Pages do the work. #GitHubPages #WebDevelopment #FrontendDevelopment #ReactJS #DeployYourApp #WebDev #CodingLife #DevCommunity #GitHub #JavaScript #WebDesign #SoftwareDevelopment #Programming

Ever wonder how to keep your JavaScript/TypeScript projects clean, consistent, and automated? Look no further! 💡 These three tools are game-changers for any developer: -- ESLint for pristine code quality. -- Prettier for effortless code formatting. -- Husky for robust Git automation. I've personally seen a huge boost in productivity and code maintainability by integrating these into my workflow. What's one tool you can't live without in your development stack? Let's discuss! #CodeQuality #DeveloperLife #Programming #Frontend #Backend #Git #SoftwareDevelopment #SoftwareEngineering #Technology #Coding #Tech #Innovation

Don't let your React project turn into a mess! A clean folder structure is the key to scalable and maintainable code. I'm sharing my preferred project layout that separates concerns and makes finding code much simpler: -> pages (URL-based views) -> components (Reusable Ul elements) -> hooks (Reusable logic) -> contexts (State sharing) -> layouts (Dynamic containers like Navbars/Sidebars) Check out the slides for a full breakdown! What structure works best for you? To learn more about React, follow W3Schools.com, JavaScript Mastery Follow Muhammad Nouman for more useful content #ReactAppStructure #CodeOrganization #BestPractices #ReactDeveloper #Coding

I finished #NamasteReact by Akshay Saini 🚀 Episode 2: Igniting Our App, where I learned about several important concepts such as … ✅ What is npm? It helps developers install, manage, and share reusable code. npx is used to run npm packages without installing them globally. ✅ package.json vs package-lock.json package.json – Project blueprint (name, version, dependencies, scripts). package-lock.json – Records exact versions of all dependencies; ensures consistency across systems. ✅ Dependencies vs DevDependencies dependencies – Required for the app to run in production. devDependencies – Required only during development (e.g., testing, bundlers). ✅ What is a Bundler? Bundlers like Parcel and Webpack package and optimize code for production. They minify, compress, clean, and remove unused code (tree shaking). ✅ Important Concepts (in bullet points) .parcel-cache → Stores cache for faster rebuilds. /dist folder → Final production-ready optimized code. browserslist → Specifies which browsers your project supports. Hot Module Replacement (HMR) → Updates code instantly without page reload. Tree Shaking → Removes unused code from the final bundle. Transitive Dependencies → Dependencies of your dependencies. .gitignore → Tells Git which files/folders to ignore (like node_modules, dist). npx → Executes packages directly without installing them. #WebDevelopment #ReactJS #Frontend #JavaScript #LearningJourney #Coding #Programming #cleancode #softwareEngineer #Devlife #linkedinjourney #LearningJourney #CareerGrowth #CodeSmarter #NamasteReact #IgnitingOurApp #react #AkshaySaini #reactDom #fullstackdeveloper

Spent sometime exploring how Go handles project setup, especially Go Modules, and the experience feels very different from JavaScript and TypeScript. In JS, you must install a package manager (npm, yarn, pnpm), create a package.json, and rely on a bunch of external tooling before writing any real logic. Nothing about dependency management is built into the language itself. Go is the opposite. Running go mod init and go mod tidy was enough to create a clean, predictable workspace all with built-in dependency management. That clarity and lack of extra tooling makes you focus on the actual program instead of setup. I’m starting to see why many backend developers appreciate Go’s design philosophy. #Golang #JavaScript #TypeScript #BackendDevelopment #LearningInPublic

Conquering the JavaScript Roadmap 🚀 The journey of a thousand lines begins with a single comment.Today, we're not just writing code; we're building the foundation for innovation This detailed roadmap covers everything essential from understanding why JavaScript is important and how to run it in the browser using the <script> tag, to mastering core variables like var, let, and const with Sheryians Coding School and our one and only Harsh Vandana Sharma #JavaScript #CodingJourney #WebDevelopment #CodeLife #LearnToCode #FrontendDevelopment #JSFundamentals

npm run dev vs npm run build — My Humbling Lesson As a junior dev, I used to think: “If my app spins up and the terminal is green ✅ — I’m good. Zero bugs.” Then reality hit… Working on a production project, I pushed changes, opened a PR, feeling confident. Suddenly — got that weird message! 💥 “Hey bro, your changes broke the CI pipeline.” Me? Impossible. My terminal was green! I even tried to deny it at first Then my teammate calmly said: “Run npm run build and check again.” Boom. Errors everywhere. Unused variables. Lingering logs. Stuff I thought didn’t matter “for now.” Lesson learned ✅ npm run dev helps you develop ✅ npm run build tells you if your code can survive the real world Now before pushing any code: - npm run build - clean up - lint & fix 🧹 Every. Single. Time. If you're starting out — don’t trust only the green dev console Your future self (and your team) will thank you! 💡 Takeaway If it works on your machine but not in CI/CD, the problem is probably not CI/CD… it’s your build. #webdevelopment #frontend #javascript #reactjs #nextjs #cleanCode #softwareengineering #devlife #learninginpublic #techjourney #npm #typescript #juniorToSenior

GitHub: https://lnkd.in/g5hfiHs5 🔥 Project 12/20 – Fetch API (Random Joke) ✨ A fun Random Joke Generator built using JavaScript + async/await! ✨ This project fetches a new joke from an API with just one click. Key highlights: 😂 Fetch random jokes ⚡ async/await for smooth asynchronous code 🔁 Updates instantly on button press A clean and beginner-friendly API project for your portfolio. Don’t just code — fetch a smile 🚀 #webdevelopment #javascript #frontenddevelopment #frontendprojects #htmlcssjs #fetchapi #asyncawait #apicalls #vanillajs #learnjavascript #programming #webdesign #techcommunity #githubproject #uicomponents #frontendinspiration #modernui #creativefrontend #webdevcommunity #codinglife #developerlife #softwareengineering #programminglife #frontendskills #codewithusman

6 Sites That Actually Improve Your JavaScript Level up your JavaScript with practice that sticks. These 6 sites deliver real tasks, feedback, and projects: JSChallenger, Frontend Mentor, Edabit, Codewars, Scrimba, freeCodeCamp. Pick one and code for 15 minutes today. Track your streak in GitHub, share wins weekly, and turn small reps into portfolio projects. #JavaScript #WebDevelopment #Frontend #CodingPractice #LearnToCode #100DaysOfCode #DevCommunity #Coding