<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0"><channel><title><![CDATA[My Developer Journey – Insights by Srikant Sahu]]></title><description><![CDATA[Follow my journey as a full-stack developer sharing tips, tools, and insights for modern web development.]]></description><link>https://blog.srikantsahu.in</link><image><url>https://cdn.hashnode.com/res/hashnode/image/upload/v1748763205730/52686b32-0208-4c66-bf15-5350041e69e8.png</url><title>My Developer Journey – Insights by Srikant Sahu</title><link>https://blog.srikantsahu.in</link></image><generator>RSS for Node</generator><lastBuildDate>Fri, 08 May 2026 15:05:16 GMT</lastBuildDate><atom:link href="https://blog.srikantsahu.in/rss.xml" rel="self" type="application/rss+xml"/><language><![CDATA[en]]></language><ttl>60</ttl><item><title><![CDATA[What Happens If AI Disappears Tomorrow — Or Becomes Too Expensive to Use?]]></title><description><![CDATA[AI has become part of our daily workflow faster than anyone expected.But what happens if it suddenly disappears — or becomes too expensive for most people to afford?


We’ve Become Dependent Faster Th]]></description><link>https://blog.srikantsahu.in/what-happens-if-ai-becomes-too-expensive</link><guid isPermaLink="true">https://blog.srikantsahu.in/what-happens-if-ai-becomes-too-expensive</guid><category><![CDATA[AI]]></category><category><![CDATA[Artificial Intelligence]]></category><category><![CDATA[technology]]></category><category><![CDATA[developers]]></category><category><![CDATA[Future Technology]]></category><category><![CDATA[Programming Blogs]]></category><category><![CDATA[Machine Learning]]></category><category><![CDATA[Productivity]]></category><dc:creator><![CDATA[Srikant Sahu]]></dc:creator><pubDate>Thu, 07 May 2026 13:59:19 GMT</pubDate><enclosure url="https://cdn.hashnode.com/uploads/covers/683b412b7036d8c66a8042b2/c2c77bba-c6ac-471b-8936-9c6811dbd0f0.png" length="0" type="image/jpeg"/><content:encoded><![CDATA[<blockquote>
<p>AI has become part of our daily workflow faster than anyone expected.<br />But what happens if it suddenly disappears — or becomes too expensive for most people to afford?</p>
</blockquote>
<hr />
<h2>We’ve Become Dependent Faster Than We Realize</h2>
<p>The scary part about technology isn’t when it arrives.</p>
<p>It’s when people stop noticing they depend on it.</p>
<p>A few years ago:</p>
<ul>
<li>Developers searched Stack Overflow for everything</li>
<li>Designers spent hours creating assets manually</li>
<li>Writers brainstormed from scratch</li>
<li>Businesses hired entire teams for repetitive tasks</li>
</ul>
<p>Now?</p>
<p>One AI prompt can complete work that used to take hours.</p>
<p>That’s not laziness.<br />That’s efficiency.</p>
<p>But efficiency creates dependency.</p>
<p>And dependency creates risk.</p>
<hr />
<h1>If AI Disappeared Tomorrow…</h1>
<p>The internet wouldn’t collapse.</p>
<p>But productivity absolutely would.</p>
<hr />
<h2>Developers Would Feel It First</h2>
<p>AI coding assistants have completely changed how developers work.</p>
<p>Today, AI helps with:</p>
<ul>
<li>Debugging</li>
<li>Boilerplate code generation</li>
<li>Documentation</li>
<li>Learning new frameworks</li>
<li>Refactoring</li>
<li>Explaining complex logic</li>
</ul>
<p>Without AI:</p>
<ul>
<li>Development becomes slower</li>
<li>Junior developers struggle more</li>
<li>Small teams lose leverage</li>
<li>MVP timelines increase</li>
<li>Solo founders become less competitive</li>
</ul>
<p>People who learned to <em>build with AI</em> would suddenly need to relearn how to work without it.</p>
<hr />
<h2>Content Creation Would Slow Down Dramatically</h2>
<p>Right now, AI helps creators:</p>
<ul>
<li>Write blogs</li>
<li>Generate thumbnails</li>
<li>Create scripts</li>
<li>Edit videos</li>
<li>Research topics</li>
<li>Repurpose content</li>
</ul>
<p>If AI vanished, creators wouldn’t stop creating.</p>
<p>But output volume would crash overnight.</p>
<p>The people winning today aren’t always the most talented.</p>
<p>Sometimes they’re simply the fastest.</p>
<p>AI is the speed multiplier.</p>
<hr />
<h2>Small Businesses Would Suffer More Than Big Companies</h2>
<p>Large companies can survive without AI.</p>
<p>They have:</p>
<ul>
<li>Teams</li>
<li>Infrastructure</li>
<li>Capital</li>
<li>Existing systems</li>
</ul>
<p>Small businesses don’t.</p>
<p>A solo founder using AI today can compete with companies 10x larger than them.</p>
<p>That advantage disappears instantly if AI becomes inaccessible.</p>
<p>Ironically, the technology that democratized opportunity could eventually become a luxury product.</p>
<hr />
<h1>The Bigger Problem: What If AI Doesn’t Disappear — But Gets Expensive?</h1>
<p>This scenario is actually more realistic.</p>
<p>Most powerful AI systems are controlled by a small number of companies with massive infrastructure costs.</p>
<p>Training models costs millions.</p>
<p>Running them costs even more.</p>
<p>At some point, companies will push harder for profitability.</p>
<p>And when that happens, users may face:</p>
<ul>
<li>Higher subscription costs</li>
<li>Strict usage limits</li>
<li>Pay-per-request pricing</li>
<li>Premium-only advanced models</li>
<li>Locked enterprise ecosystems</li>
</ul>
<p>We already see hints of this happening.</p>
<p>Today, many people casually rely on AI because it feels affordable.</p>
<p>But if pricing changes aggressively, millions of users could suddenly lose access to tools they built workflows around.</p>
<hr />
<h1>A New Digital Divide Could Appear</h1>
<p>In the early internet era, the divide was:</p>
<blockquote>
<p>“Who has internet access?”</p>
</blockquote>
<p>In the AI era, the divide may become:</p>
<blockquote>
<p>“Who can afford intelligence acceleration?”</p>
</blockquote>
<p>That changes everything.</p>
<ul>
<li>Students with AI become faster learners</li>
<li>Businesses with AI become more efficient</li>
<li>Developers with AI ship faster</li>
<li>Creators with AI dominate algorithms</li>
</ul>
<p>Now imagine a future where only wealthy companies and premium users get access to top-tier AI.</p>
<p>That creates an uneven playing field overnight.</p>
<hr />
<h1>The Real Danger Isn’t Losing AI</h1>
<p>The real danger is forgetting how to think without it.</p>
<p>AI is an incredible tool.</p>
<p>But tools should amplify skill — not replace understanding.</p>
<p>If developers stop learning fundamentals...<br />If writers stop developing original thought...<br />If creators stop practicing creativity...</p>
<p>Then dependency becomes dangerous.</p>
<p>The smartest people in the future won’t be the ones who use AI for everything.</p>
<p>They’ll be the ones who can still operate when AI fails.</p>
<hr />
<h1>So What Should We Do?</h1>
<h2>1. Learn Core Skills Anyway</h2>
<p>Use AI to accelerate learning — not skip it.</p>
<p>If you’re a developer, understand the logic behind generated code.</p>
<p>If you’re a writer, improve your thinking instead of only generating words.</p>
<p>AI should be your assistant, not your brain replacement.</p>
<hr />
<h2>2. Avoid Depending on a Single AI Provider</h2>
<p>A lot of startups today are basically wrappers around one API.</p>
<p>That’s risky.</p>
<p>If pricing changes or access disappears, entire business models can collapse overnight.</p>
<p>Diversification matters.</p>
<hr />
<h2>3. Appreciate This Current AI Era</h2>
<p>Right now, we’re living through a strange moment in tech history.</p>
<p>Powerful intelligence tools are available to ordinary people at relatively low cost.</p>
<p>That may not always be true.</p>
<p>The people who use this phase wisely will probably have a huge advantage in the future.</p>
<hr />
<h1>Final Thoughts</h1>
<p>AI disappearing tomorrow sounds unlikely.</p>
<p>But technology shifts happen faster than people expect.</p>
<p>Platforms die.<br />Prices change.<br />Access gets restricted.<br />Markets evolve.</p>
<p>The important question isn’t:</p>
<blockquote>
<p>“Will AI always exist?”</p>
</blockquote>
<p>The real question is:</p>
<blockquote>
<p>“Are we building skills and systems that survive without it?”</p>
</blockquote>
<p>Because the future belongs to people who can adapt — with or without AI.</p>
<hr />
<h2>Tags</h2>
<p><code>AI</code> <code>Artificial Intelligence</code> <code>Future of AI</code> <code>Technology</code> <code>Productivity</code> <code>Developers</code> <code>Startups</code> <code>Machine Learning</code></p>
]]></content:encoded></item><item><title><![CDATA[Building a Simple MERN Stack App—A Hands-On Walkthrough 💻]]></title><description><![CDATA[Welcome to Day 1 of my daily blogging series! Today, we’ll dive into creating a minimal MERN stack app from scratch. By the end of this post, you’ll have:

A basic Express and Node.js backend with a single API endpoint.

A MongoDB database connected ...]]></description><link>https://blog.srikantsahu.in/building-a-simple-mern-stack-appa-hands-on-walkthrough</link><guid isPermaLink="true">https://blog.srikantsahu.in/building-a-simple-mern-stack-appa-hands-on-walkthrough</guid><category><![CDATA[todoapp]]></category><category><![CDATA[MERN Stack]]></category><category><![CDATA[React]]></category><category><![CDATA[JavaScript]]></category><dc:creator><![CDATA[Srikant Sahu]]></dc:creator><pubDate>Sun, 01 Jun 2025 14:53:03 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/stock/unsplash/hSODeSbvzE0/upload/76fb1d8c5bb7bc5b3785efa6ef20863d.jpeg" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>Welcome to Day 1 of my daily blogging series! Today, we’ll dive into creating a minimal MERN stack app from scratch. By the end of this post, you’ll have:</p>
<ul>
<li><p>A basic Express and Node.js backend with a single API endpoint.</p>
</li>
<li><p>A MongoDB database connected via Mongoose.</p>
</li>
<li><p>A React front end that fetches data from your backend.</p>
</li>
<li><p>A deployed version of your app (optional).</p>
</li>
</ul>
<blockquote>
<p><strong>Note:</strong> If you’re new to any piece of this stack, feel free to bookmark this tutorial and revisit as you get more familiar. Let’s get started!</p>
</blockquote>
<hr />
<h2 id="heading-project-setup-amp-folder-structure">Project Setup &amp; Folder Structure</h2>
<p>First, create a new folder for your project. In your terminal:</p>
<pre><code class="lang-bash">mkdir mern-todo-app
<span class="hljs-built_in">cd</span> mern-todo-app
</code></pre>
<p>Inside, we’ll have two main directories: <code>server</code> and <code>client</code>:</p>
<pre><code class="lang-pgsql">mern-todo-app/
├── <span class="hljs-keyword">server</span>/
└── client/
</code></pre>
<ul>
<li><p><code>server/</code>: All backend-related code (Express, Node.js, MongoDB).</p>
</li>
<li><p><code>client/</code>: React front end (using Create React App).</p>
</li>
</ul>
<hr />
<h2 id="heading-backend-express-amp-mongodb">Backend: Express &amp; MongoDB</h2>
<h3 id="heading-initialize-the-server">Initialize the Server</h3>
<p>Navigate to <code>server/</code> and initialize a Node project:</p>
<pre><code class="lang-bash"><span class="hljs-built_in">cd</span> server
npm init -y
</code></pre>
<p>Install dependencies:</p>
<pre><code class="lang-bash">npm install express mongoose cors dotenv
</code></pre>
<ul>
<li><p><code>express</code>: Web framework.</p>
</li>
<li><p><code>mongoose</code>: MongoDB ODM.</p>
</li>
<li><p><code>cors</code>: Allow cross-origin requests.</p>
</li>
<li><p><code>dotenv</code>: Manage environment variables.</p>
</li>
</ul>
<p>In <code>server/</code>, create a file named <code>server.js</code>:</p>
<pre><code class="lang-javascript"><span class="hljs-comment">// server/server.js</span>
<span class="hljs-keyword">import</span> express <span class="hljs-keyword">from</span> <span class="hljs-string">'express'</span>;
<span class="hljs-keyword">import</span> mongoose <span class="hljs-keyword">from</span> <span class="hljs-string">'mongoose'</span>;
<span class="hljs-keyword">import</span> cors <span class="hljs-keyword">from</span> <span class="hljs-string">'cors'</span>;
<span class="hljs-keyword">import</span> dotenv <span class="hljs-keyword">from</span> <span class="hljs-string">'dotenv'</span>;

dotenv.config();

<span class="hljs-keyword">const</span> app = express();
<span class="hljs-keyword">const</span> PORT = process.env.PORT || <span class="hljs-number">5000</span>;

<span class="hljs-comment">// Middleware</span>
app.use(cors());
app.use(express.json());

<span class="hljs-comment">// MongoDB Connection</span>
mongoose
  .connect(process.env.MONGO_URI, {
    <span class="hljs-attr">useNewUrlParser</span>: <span class="hljs-literal">true</span>,
    <span class="hljs-attr">useUnifiedTopology</span>: <span class="hljs-literal">true</span>,
  })
  .then(<span class="hljs-function">() =&gt;</span> <span class="hljs-built_in">console</span>.log(<span class="hljs-string">'✅ MongoDB connected'</span>))
  .catch(<span class="hljs-function">(<span class="hljs-params">err</span>) =&gt;</span> <span class="hljs-built_in">console</span>.error(<span class="hljs-string">'❌ MongoDB connection error:'</span>, err));

<span class="hljs-comment">// Simple Mongoose Schema</span>
<span class="hljs-keyword">const</span> todoSchema = <span class="hljs-keyword">new</span> mongoose.Schema({
  <span class="hljs-attr">text</span>: { <span class="hljs-attr">type</span>: <span class="hljs-built_in">String</span>, <span class="hljs-attr">required</span>: <span class="hljs-literal">true</span> },
  <span class="hljs-attr">completed</span>: { <span class="hljs-attr">type</span>: <span class="hljs-built_in">Boolean</span>, <span class="hljs-attr">default</span>: <span class="hljs-literal">false</span> },
});

<span class="hljs-keyword">const</span> Todo = mongoose.model(<span class="hljs-string">'Todo'</span>, todoSchema);

<span class="hljs-comment">// Routes</span>
app.get(<span class="hljs-string">'/api/todos'</span>, <span class="hljs-keyword">async</span> (req, res) =&gt; {
  <span class="hljs-keyword">try</span> {
    <span class="hljs-keyword">const</span> todos = <span class="hljs-keyword">await</span> Todo.find();
    res.json(todos);
  } <span class="hljs-keyword">catch</span> (err) {
    res.status(<span class="hljs-number">500</span>).json({ <span class="hljs-attr">message</span>: err.message });
  }
});

app.post(<span class="hljs-string">'/api/todos'</span>, <span class="hljs-keyword">async</span> (req, res) =&gt; {
  <span class="hljs-keyword">const</span> { text } = req.body;
  <span class="hljs-keyword">const</span> newTodo = <span class="hljs-keyword">new</span> Todo({ text });
  <span class="hljs-keyword">try</span> {
    <span class="hljs-keyword">const</span> savedTodo = <span class="hljs-keyword">await</span> newTodo.save();
    res.status(<span class="hljs-number">201</span>).json(savedTodo);
  } <span class="hljs-keyword">catch</span> (err) {
    res.status(<span class="hljs-number">400</span>).json({ <span class="hljs-attr">message</span>: err.message });
  }
});

<span class="hljs-comment">// Start server</span>
app.listen(PORT, <span class="hljs-function">() =&gt;</span> <span class="hljs-built_in">console</span>.log(<span class="hljs-string">`🚀 Server running on port <span class="hljs-subst">${PORT}</span>`</span>));
</code></pre>
<p>Add a <code>.env</code> file in <code>server/</code>:</p>
<pre><code class="lang-ini"><span class="hljs-attr">MONGO_URI</span>=your_mongodb_connection_string_here
</code></pre>
<h3 id="heading-run-the-server">Run the Server</h3>
<p>In <code>server/</code> directory, add a start script to <code>package.json</code>:</p>
<pre><code class="lang-json"><span class="hljs-string">"scripts"</span>: {
  <span class="hljs-attr">"start"</span>: <span class="hljs-string">"node --experimental-modules server.js"</span>
}
</code></pre>
<p>Then run:</p>
<pre><code class="lang-bash">npm start
</code></pre>
<p>You should see “MongoDB connected” and “Server running on port 5000” in your console.</p>
<hr />
<h2 id="heading-front-end-react-application">Front End: React Application</h2>
<h3 id="heading-bootstrap-react">Bootstrap React</h3>
<p>In the project root (<code>mern-todo-app/</code>), run:</p>
<pre><code class="lang-bash">npx create-react-app client
</code></pre>
<p>Navigate into <code>client/</code>:</p>
<pre><code class="lang-bash"><span class="hljs-built_in">cd</span> client
</code></pre>
<p>Install Axios (or fetch is fine, but Axios simplifies JSON calls):</p>
<pre><code class="lang-bash">npm install axios
</code></pre>
<h3 id="heading-building-the-todo-interface">Building the Todo Interface</h3>
<p>In <code>client/src/App.js</code>, replace with:</p>
<pre><code class="lang-javascript"><span class="hljs-comment">// client/src/App.js</span>
<span class="hljs-keyword">import</span> React, { useState, useEffect } <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>;
<span class="hljs-keyword">import</span> axios <span class="hljs-keyword">from</span> <span class="hljs-string">'axios'</span>;

<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">App</span>(<span class="hljs-params"></span>) </span>{
  <span class="hljs-keyword">const</span> [todos, setTodos] = useState([]);
  <span class="hljs-keyword">const</span> [text, setText] = useState(<span class="hljs-string">''</span>);

  useEffect(<span class="hljs-function">() =&gt;</span> {
    fetchTodos();
  }, []);

  <span class="hljs-keyword">const</span> fetchTodos = <span class="hljs-keyword">async</span> () =&gt; {
    <span class="hljs-keyword">try</span> {
      <span class="hljs-keyword">const</span> res = <span class="hljs-keyword">await</span> axios.get(<span class="hljs-string">'http://localhost:5000/api/todos'</span>);
      setTodos(res.data);
    } <span class="hljs-keyword">catch</span> (err) {
      <span class="hljs-built_in">console</span>.error(err);
    }
  };

  <span class="hljs-keyword">const</span> addTodo = <span class="hljs-keyword">async</span> (e) =&gt; {
    e.preventDefault();
    <span class="hljs-keyword">if</span> (!text) <span class="hljs-keyword">return</span>;
    <span class="hljs-keyword">try</span> {
      <span class="hljs-keyword">await</span> axios.post(<span class="hljs-string">'http://localhost:5000/api/todos'</span>, { text });
      setText(<span class="hljs-string">''</span>);
      fetchTodos();
    } <span class="hljs-keyword">catch</span> (err) {
      <span class="hljs-built_in">console</span>.error(err);
    }
  };

  <span class="hljs-keyword">return</span> (
    <span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{styles.container}</span>&gt;</span>
      <span class="hljs-tag">&lt;<span class="hljs-name">h1</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{styles.heading}</span>&gt;</span>My TODO App (MERN Stack)<span class="hljs-tag">&lt;/<span class="hljs-name">h1</span>&gt;</span>
      <span class="hljs-tag">&lt;<span class="hljs-name">form</span> <span class="hljs-attr">onSubmit</span>=<span class="hljs-string">{addTodo}</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{styles.form}</span>&gt;</span>
        <span class="hljs-tag">&lt;<span class="hljs-name">input</span>
          <span class="hljs-attr">type</span>=<span class="hljs-string">"text"</span>
          <span class="hljs-attr">value</span>=<span class="hljs-string">{text}</span>
          <span class="hljs-attr">onChange</span>=<span class="hljs-string">{(e)</span> =&gt;</span> setText(e.target.value)}
          placeholder="Enter a task..."
          style={styles.input}
        /&gt;
        <span class="hljs-tag">&lt;<span class="hljs-name">button</span> <span class="hljs-attr">type</span>=<span class="hljs-string">"submit"</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{styles.button}</span>&gt;</span>
          Add Todo
        <span class="hljs-tag">&lt;/<span class="hljs-name">button</span>&gt;</span>
      <span class="hljs-tag">&lt;/<span class="hljs-name">form</span>&gt;</span>
      <span class="hljs-tag">&lt;<span class="hljs-name">ul</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{styles.list}</span>&gt;</span>
        {todos.map((todo) =&gt; (
          <span class="hljs-tag">&lt;<span class="hljs-name">li</span> <span class="hljs-attr">key</span>=<span class="hljs-string">{todo._id}</span> <span class="hljs-attr">style</span>=<span class="hljs-string">{styles.listItem}</span>&gt;</span>
            {todo.text}
          <span class="hljs-tag">&lt;/<span class="hljs-name">li</span>&gt;</span>
        ))}
      <span class="hljs-tag">&lt;/<span class="hljs-name">ul</span>&gt;</span>
    <span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span></span>
  );
}

<span class="hljs-keyword">const</span> styles = {
  <span class="hljs-attr">container</span>: {
    <span class="hljs-attr">maxWidth</span>: <span class="hljs-string">'600px'</span>,
    <span class="hljs-attr">margin</span>: <span class="hljs-string">'2rem auto'</span>,
    <span class="hljs-attr">padding</span>: <span class="hljs-string">'1rem'</span>,
    <span class="hljs-attr">textAlign</span>: <span class="hljs-string">'center'</span>,
    <span class="hljs-attr">fontFamily</span>: <span class="hljs-string">'Arial, sans-serif'</span>,
  },
  <span class="hljs-attr">heading</span>: {
    <span class="hljs-attr">marginBottom</span>: <span class="hljs-string">'1.5rem'</span>,
  },
  <span class="hljs-attr">form</span>: {
    <span class="hljs-attr">display</span>: <span class="hljs-string">'flex'</span>,
    <span class="hljs-attr">justifyContent</span>: <span class="hljs-string">'center'</span>,
    <span class="hljs-attr">marginBottom</span>: <span class="hljs-string">'1rem'</span>,
  },
  <span class="hljs-attr">input</span>: {
    <span class="hljs-attr">padding</span>: <span class="hljs-string">'0.5rem'</span>,
    <span class="hljs-attr">width</span>: <span class="hljs-string">'60%'</span>,
    <span class="hljs-attr">fontSize</span>: <span class="hljs-string">'1rem'</span>,
  },
  <span class="hljs-attr">button</span>: {
    <span class="hljs-attr">padding</span>: <span class="hljs-string">'0.5rem 1rem'</span>,
    <span class="hljs-attr">marginLeft</span>: <span class="hljs-string">'0.5rem'</span>,
    <span class="hljs-attr">fontSize</span>: <span class="hljs-string">'1rem'</span>,
  },
  <span class="hljs-attr">list</span>: {
    <span class="hljs-attr">listStyle</span>: <span class="hljs-string">'none'</span>,
    <span class="hljs-attr">padding</span>: <span class="hljs-number">0</span>,
  },
  <span class="hljs-attr">listItem</span>: {
    <span class="hljs-attr">background</span>: <span class="hljs-string">'#f8f8f8'</span>,
    <span class="hljs-attr">margin</span>: <span class="hljs-string">'0.5rem 0'</span>,
    <span class="hljs-attr">padding</span>: <span class="hljs-string">'0.75rem'</span>,
    <span class="hljs-attr">borderRadius</span>: <span class="hljs-string">'4px'</span>,
    <span class="hljs-attr">textAlign</span>: <span class="hljs-string">'left'</span>,
  },
};

<span class="hljs-keyword">export</span> <span class="hljs-keyword">default</span> App;
</code></pre>
<p>Start the React app:</p>
<pre><code class="lang-bash">npm start
</code></pre>
<p>It should open on <a target="_blank" href="http://localhost:3000"><code>http://localhost:3000</code></a>, showing a header, input field, and empty list.</p>
<hr />
<h2 id="heading-testing-it-out">Testing It Out</h2>
<ul>
<li><p>Make sure your backend server (<a target="_blank" href="http://localhost:5000"><code>localhost:5000</code></a>) is running.</p>
</li>
<li><p>In the front end, type a new to-do (e.g., “Learn MERN Stack”) and click <strong>Add Todo</strong>.</p>
</li>
<li><p>Check the list below—your new task should appear, pulled from MongoDB.</p>
</li>
</ul>
<hr />
<h2 id="heading-optional-deploying-to-production">(Optional) Deploying to Production</h2>
<p>If you want to deploy, here’s a quick outline:</p>
<h3 id="heading-backend-heroku-render-or-similar">Backend (Heroku, Render, or similar):</h3>
<ul>
<li><p>Update <code>server.js</code> to serve the front end in production:</p>
<pre><code class="lang-javascript">  <span class="hljs-comment">// After your API routes in server.js</span>
  <span class="hljs-keyword">if</span> (process.env.NODE_ENV === <span class="hljs-string">'production'</span>) {
    app.use(express.static(<span class="hljs-string">'../client/build'</span>));
    app.get(<span class="hljs-string">'*'</span>, <span class="hljs-function">(<span class="hljs-params">req, res</span>) =&gt;</span>
      res.sendFile(path.resolve(__dirname, <span class="hljs-string">'../client'</span>, <span class="hljs-string">'build'</span>, <span class="hljs-string">'index.html'</span>))
    );
  }
</code></pre>
</li>
<li><p>Push to Heroku, ensure <code>MONGO_URI</code> is set in Heroku’s config vars.</p>
</li>
</ul>
<h3 id="heading-frontend-vercel-netlify-or-serve-from-heroku">Frontend (Vercel, Netlify, or serve from Heroku):</h3>
<ul>
<li><p>In <code>client/</code>, run <code>npm run build</code> to generate a production bundle.</p>
</li>
<li><p>If using separate hosts, deploy the <code>build/</code> folder (Netlify/Vercel).</p>
</li>
<li><p>Update the Axios base URL to your live backend URL.</p>
</li>
</ul>
<hr />
<h2 id="heading-wrapping-up">Wrapping Up</h2>
<p>Congratulations! 🎉 You’ve built a functional MERN stack todo app:</p>
<ul>
<li><p><strong>Express/Node.js</strong> server with API endpoints</p>
</li>
<li><p><strong>MongoDB</strong> for data storage via <strong>Mongoose</strong></p>
</li>
<li><p><strong>React</strong> front end fetching and displaying data</p>
</li>
</ul>
<p>This basic project lays the foundation for scaling up—adding authentication, advanced routing, Redux/Context for state, or responsive styling with Tailwind. In Day 2, we’ll explore state management in React and dive deeper into Hooks. Stay tuned!</p>
<blockquote>
<p>In this tutorial, you'll learn to create a minimal MERN stack app from scratch. By the end, you'll have a basic Express and Node.js backend with MongoDB connected via Mongoose, a React front end fetching data from your backend, and an optional deployed version of your app. The guide includes full setup instructions, from project initialization to running both the server and React app locally. Stay tuned for Day 2, where we'll explore state management in React with Hooks.</p>
</blockquote>
]]></content:encoded></item><item><title><![CDATA[From Mechanical Engineering to Full Stack Developer: My Journey into Web Development]]></title><description><![CDATA[Hello, tech enthusiasts! 👋 I'm Srikant Sahu, a mechanical engineering graduate turned passionate Full Stack Developer. Today, I’m excited to share my journey into the fascinating world of web development.
🎓 From Mechanical Engineering to Coding
I g...]]></description><link>https://blog.srikantsahu.in/from-mechanical-engineering-to-full-stack-developer-my-journey-into-web-development</link><guid isPermaLink="true">https://blog.srikantsahu.in/from-mechanical-engineering-to-full-stack-developer-my-journey-into-web-development</guid><category><![CDATA[Web Development]]></category><category><![CDATA[webdev]]></category><category><![CDATA[React]]></category><category><![CDATA[MERN Stack]]></category><dc:creator><![CDATA[Srikant Sahu]]></dc:creator><pubDate>Sun, 01 Jun 2025 09:37:57 GMT</pubDate><enclosure url="https://cdn.hashnode.com/res/hashnode/image/stock/unsplash/vpOeXr5wmR4/upload/d23c262106dcc6815d29ec4f5264ff86.jpeg" length="0" type="image/jpeg"/><content:encoded><![CDATA[<p>Hello, tech enthusiasts! 👋 I'm <strong>Srikant Sahu</strong>, a mechanical engineering graduate turned passionate Full Stack Developer. Today, I’m excited to share my journey into the fascinating world of web development.</p>
<h3 id="heading-from-mechanical-engineering-to-coding">🎓 From Mechanical Engineering to Coding</h3>
<p>I graduated with my BTech in Mechanical Engineering in 2023. However, my journey took an unexpected turn during the COVID-19 lockdown. With ample time at home, I became curious about digital technology and the endless possibilities of coding.</p>
<p>Initially, I felt overwhelmed by where to begin. After countless hours spent on YouTube, blogs, and seeking advice from seniors, I tried learning <strong>Java</strong>. Soon, I realized Java’s vastness wasn't the ideal starting point for me. But this didn't deter my enthusiasm!</p>
<h3 id="heading-discovering-web-development">💻 Discovering Web Development</h3>
<p>Web development caught my eye next. Building websites seemed fascinating and approachable, so I dove into learning the basics—<strong>HTML, CSS, and JavaScript</strong>. Creating simple web pages became a joy, igniting a passion that pushed me deeper into this world.</p>
<p>After graduation, I decided to further sharpen my skills and enrolled at <strong>JSpiders, Bangalore</strong> for a comprehensive MERN stack program. Over six months, I gained hands-on experience with:</p>
<ul>
<li><p>HTML &amp; CSS</p>
</li>
<li><p>JavaScript &amp; ReactJS</p>
</li>
<li><p>MongoDB, Node.js, Express.js</p>
</li>
<li><p>SQL</p>
</li>
<li><p>Aptitude and logical thinking</p>
</li>
</ul>
<h3 id="heading-overcoming-challenges">🛠️ Overcoming Challenges</h3>
<p>Transitioning from a mechanical engineering background meant logical thinking and coding weren’t initially intuitive for me. Breaking down problems and coding solutions was challenging, but consistent practice, mock interviews, and leveraging AI and Stack Overflow turned these hurdles into growth opportuni</p>
<h3 id="heading-my-professional-journey">🎯 My Professional Journey</h3>
<p>Post-training, I secured my first remote job, annotating web UI elements as HTML tags. Four months later, I was promoted and moved to Hyderabad, transitioning into creating UI components.</p>
<p>After finishing my internship there, I prepared rigorously for three months and landed my current role as a <strong>Junior Full Stack Developer</strong> at a dynamic startup in Bhubaneswar. Here, I create real-world web solutions like admin panels, landing pages, and more. I'm proud to share that I've now completed <strong>1.2 years</strong> at this vibrant company!</p>
<h3 id="heading-whats-next">🌟 What's Next?</h3>
<p>Looking ahead, I'm committed to continuous learning and staying ahead of tech trends. My aspirations include:</p>
<ul>
<li><p>Starting my own venture</p>
</li>
<li><p>Freelancing</p>
</li>
<li><p>Joining a renowned tech company to further elevate my skills and experience</p>
</li>
</ul>
<h3 id="heading-connect-with-me">📌 Connect with Me!</h3>
<p>I’d love to connect, collaborate, or simply chat about all things tech and career growth!</p>
<ul>
<li><p>🌐 <a target="_blank" href="https://srikantsahu.in/">Portfolio</a></p>
</li>
<li><p>💻 <a target="_blank" href="https://github.com/Srikant114">GitHub</a></p>
</li>
<li><p>🔗 <a target="_blank" href="https://www.linkedin.com/in/srikantsahu114/">LinkedIn</a></p>
</li>
</ul>
<p>Thanks for joining me on this exciting journey! If you’re considering a career shift or diving into coding, remember—<strong>consistency, curiosity, and determination</strong> are your best allies. Let’s keep coding, learning, and growing together! 🚀✨</p>
<blockquote>
<p>Srikant Sahu shares his journey from a mechanical engineering graduate to a passionate Full Stack Developer, sparked by a curiosity for coding during the COVID-19 lockdown. Initially struggling with Java, he found his path in web development by learning HTML, CSS, and JavaScript. After honing his skills through a MERN stack program, he secured jobs in web UI annotation and UI component creation. Now a Junior Full Stack Developer at a startup in Bhubaneswar, Srikant is focused on continuous learning, with aspirations of starting his own venture, freelancing, or joining a renowned tech company.</p>
</blockquote>
<h2 id="heading-conclusion">Conclusion</h2>
<p>In conclusion, my journey from mechanical engineering to becoming a Full Stack Developer has been a transformative experience filled with learning, challenges, and growth. Embracing the world of web development has not only allowed me to build technical skills but also to discover a passion for creating impactful digital solutions. As I look to the future, I am excited about the endless possibilities in the tech industry and remain committed to continuous learning and innovation. Whether it's starting my own venture, freelancing, or joining a renowned tech company, I am eager to explore new opportunities and contribute to the ever-evolving world of technology. Thank you for joining me on this journey, and I look forward to connecting with fellow tech enthusiasts and professionals as we continue to learn and grow together.</p>
]]></content:encoded></item></channel></rss>