<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Hirak Kalita</title>
    <description>The latest articles on DEV Community by Hirak Kalita (@ri_hirak).</description>
    <link>https://dev.to/ri_hirak</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1119769%2F39867a3d-4937-4a45-b171-d4a0efdd4ebb.png</url>
      <title>DEV Community: Hirak Kalita</title>
      <link>https://dev.to/ri_hirak</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/ri_hirak"/>
    <language>en</language>
    <item>
      <title>Top 5 Best Web Push Notification Services in 2026</title>
      <dc:creator>Hirak Kalita</dc:creator>
      <pubDate>Sat, 04 Apr 2026 06:01:53 +0000</pubDate>
      <link>https://dev.to/ri_hirak/top-5-best-web-push-notification-services-in-2026-22c9</link>
      <guid>https://dev.to/ri_hirak/top-5-best-web-push-notification-services-in-2026-22c9</guid>
      <description>&lt;p&gt;In 2026, the digital noise is louder than ever. To cut through the static, businesses are turning away from crowded email folders and social algorithms in favor of direct, instant communication. &lt;strong&gt;Web push notifications&lt;/strong&gt; have emerged as the most effective tool for real-time engagement.&lt;/p&gt;

&lt;p&gt;If you’re looking for the right platform to boost your traffic and retention, here is our definitive guide to the &lt;strong&gt;Top 5 Best Web Push Notification Services in 2026&lt;/strong&gt;.&lt;/p&gt;

&lt;h2&gt;
  
  
  1. Trust Push (Best for Simplicity &amp;amp; High ROI)
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;&lt;a href="https://trustpush.net" rel="noopener noreferrer"&gt;Trust Push&lt;/a&gt;&lt;/strong&gt; has disrupted the market by stripping away the unnecessary complexity and high costs that bog down traditional marketing tools. While other push notification services compete on who can provide the most overwhelming data charts, Trust Push focuses on what actually matters: &lt;strong&gt;deliverability and extreme affordability.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;The standout feature of Trust Push is its disruptive pricing model. While competitors often charge hundreds of dollars as your list grows, Trust Push offers &lt;strong&gt;unlimited subscribers for just $9/month&lt;/strong&gt;. This "no-pay-per-subscriber" philosophy ensures that as your audience scales, your bill doesn't.&lt;/p&gt;

&lt;h3&gt;
  
  
  Who Is Trust Push For?
&lt;/h3&gt;

&lt;p&gt;Trust Push is perfect for those who want professional results without the steep learning curve or surprise bills. It is ideal for:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;News &amp;amp; Media Sites:&lt;/strong&gt; Send breaking news alerts and trending content notifications in real-time to keep your audience updated.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Bloggers &amp;amp; Content Publishers:&lt;/strong&gt; Grow your audience, drive repeat traffic, and notify readers the moment you hit "publish" without worrying about subscriber limits.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Digital Agencies:&lt;/strong&gt; Efficiently manage push notification campaigns across multiple client sites from a single, streamlined account.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Best For:&lt;/strong&gt; Any business that values simplicity and wants an affordable, effective way to reach millions of users instantly.&lt;/p&gt;

&lt;h2&gt;
  
  
  2. OneSignal (Best for Multi-Channel Workflows)
&lt;/h2&gt;

&lt;p&gt;OneSignal remains a powerhouse for those who need to coordinate web push with mobile apps and SMS. However, for fast-growing sites, the cost can escalate quickly as you move past their free tier.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Key Advantage:&lt;/strong&gt; Excellent for syncing messages across different devices and platforms via complex "Journeys."&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Best For:&lt;/strong&gt; Large enterprises with a massive cross-platform presence and a significant marketing budget.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  3. PushEngage (Best for E-commerce Triggers)
&lt;/h2&gt;

&lt;p&gt;PushEngage excels in behavioral automation. If a customer leaves an item in their cart or a price drops on a watched product, PushEngage is built to handle those specific triggers.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Key Advantage:&lt;/strong&gt; Deep integration with inventory and price-drop alerts for high-frequency stores.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Best For:&lt;/strong&gt; Large-scale e-commerce platforms focused on automated retargeting.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  4. VWO Engage (Best for CRO Experts)
&lt;/h2&gt;

&lt;p&gt;Part of the VWO conversion optimization suite, this tool treats every notification like a laboratory experiment. It is built for the marketer who wants to A/B test every single character of a headline.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Key Advantage:&lt;/strong&gt; Robust testing environment to see exactly which variations convert best.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Best For:&lt;/strong&gt; Data-heavy marketing teams focused exclusively on Conversion Rate Optimization.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  5. Webpushr (Best for Entry-Level Users)
&lt;/h2&gt;

&lt;p&gt;Webpushr is a reliable choice for those just dipping their toes into push notifications. It offers a straightforward dashboard and a popular WordPress plugin that handles the basics.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Key Advantage:&lt;/strong&gt; A clean interface and a solid free tier for very small websites.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Best For:&lt;/strong&gt; Hobbyist bloggers and small startups.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Conclusion: Why Trust Push Wins in 2026
&lt;/h3&gt;

&lt;p&gt;Most platforms in 2026 have become bloated and prohibitively expensive for growing sites. &lt;strong&gt;&lt;a href="https://trustpush.net" rel="noopener noreferrer"&gt;Trust Push&lt;/a&gt;&lt;/strong&gt; wins by offering a high-performance service that is 90% cheaper than the competition. By focusing on &lt;strong&gt;affordability—with unlimited subscribers for just $9/month—and a clean user experience&lt;/strong&gt;, it ensures you spend your time engaging your audience rather than managing your budget.&lt;/p&gt;

</description>
      <category>marketing</category>
      <category>webdev</category>
    </item>
    <item>
      <title>I Build OneSignal Alternative to Save $1000s of Monthly Bills on Push Notifications</title>
      <dc:creator>Hirak Kalita</dc:creator>
      <pubDate>Wed, 18 Mar 2026 14:43:32 +0000</pubDate>
      <link>https://dev.to/ri_hirak/i-build-onesignal-alternative-to-save-1000s-of-monthly-bills-on-push-notifications-4dbm</link>
      <guid>https://dev.to/ri_hirak/i-build-onesignal-alternative-to-save-1000s-of-monthly-bills-on-push-notifications-4dbm</guid>
      <description>&lt;p&gt;After 3 months of continuous development, I finally launched this MVP to help website owners save monthly push notification bills. Here are everything about the idea, and what's different in &lt;a href="https://trustpush.net" rel="noopener noreferrer"&gt;Trust Push&lt;/a&gt;.&lt;/p&gt;

&lt;h2&gt;
  
  
  My Story
&lt;/h2&gt;

&lt;p&gt;I have been doing blogging since 2021, and I often used various traffic channels like social media, Google discover, etc to get more visitors to my website. One of my favourite traffic source was &lt;em&gt;web push notifications&lt;/em&gt;.&lt;/p&gt;

&lt;p&gt;Initially, I used OneSignal, but after 10K subscribers, I need to upgrade to a paid plan which would charge me $100s of extra dollars based on my subscriber numbers.&lt;/p&gt;

&lt;p&gt;Few months later, I discovered Notix.co, which was offering 30K free subscribers with automatic monetization plan enrollment after 30K subscribers. I was unaware about their monetization plan which was literally sending 2-3 back to back spammy un-related push notification to my website subscribers, without my consent. Within 2 days, my Google search traffic was 70-80% down, yes it's real, I'm not kidding. A 1 years good traffic news website was panelized...&lt;/p&gt;

&lt;p&gt;After that day, I completely stopped using push notifications and started working on other projects. However, I found another devloper guy in my same blog niche who was using Firebase Cloud Messageing to send push notifications, I tried to implement it, but it was 2022 era. I have only a smartphone to code, plus my coding knowledge was very limited. I left that idea at that time.&lt;/p&gt;

&lt;p&gt;Later, I have discovered a self hosted WordPress plugin called &lt;strong&gt;Perfecty Push Notifications&lt;/strong&gt;. I used it, but after 12K-14K subscribers, notifications were just stopped triggering. I discovered other self-hosted solutions like LaraPush but read user reviews about notifications not getting sent after a particular subscriber count.&lt;/p&gt;

&lt;h2&gt;
  
  
  Fast forward to 2025
&lt;/h2&gt;

&lt;p&gt;I am doing good in blogging. AI code editors are booming, plus I have a laptop (realme book) to code. In the December 2025, I got an suggestion from affiliate marketing friend about push notification engagement for my websites. And that's where the journey to Trust Push was started.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Now I have a product idea that teaches me many things over 3 years&lt;/li&gt;
&lt;li&gt;I'm going to use that product&lt;/li&gt;
&lt;li&gt;It can save other bloggers/website owners save money on their push notification bills.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;I made the initial design in 1 click with Lovable Ai. After few weeks of development, I migrated to Antigravity IDE. And after working 5-6 hours a day for 3 months, on March 18, the product was ready for production uses. Of course, it is a MVP, with all essential features for sending notifications.&lt;/p&gt;

&lt;h2&gt;
  
  
  The OneSignal Alternative
&lt;/h2&gt;

&lt;p&gt;I have not made Trust Push for competing other services, I am just fixing my own pain point from my journey. OneSignal is a complete marketing platform that offers different channels, not just web push notifications, where Trust Push is for those who want a complete web push notification solution with most affordable price on the market.&lt;/p&gt;

&lt;p&gt;Plus, there are no subscribers limit on Trust Push, you can grow your subscribers without limits.&lt;/p&gt;

&lt;p&gt;That's why the tagline is: &lt;strong&gt;Grow Your Subscribers, Not Your Bills.&lt;/strong&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Last Lines
&lt;/h2&gt;

&lt;p&gt;This product is still in early stage and I have set a &lt;em&gt;Product Hunt&lt;/em&gt; launch for March 22 12:01 AM PDT. If you like this article or my creation, please hit an &lt;a href="https://www.producthunt.com/products/trust-push" rel="noopener noreferrer"&gt;upvote for Trust Push&lt;/a&gt; on or after the launch day. I am very thankful for this.&lt;/p&gt;

&lt;p&gt;If you have any questions, just comment down or use the &lt;a href="https://trustpush.net/contact" rel="noopener noreferrer"&gt;contact us page&lt;/a&gt; for any software related questions.&lt;/p&gt;

</description>
      <category>marketing</category>
      <category>saas</category>
    </item>
    <item>
      <title>Using Nprogress on React Router v7</title>
      <dc:creator>Hirak Kalita</dc:creator>
      <pubDate>Mon, 11 Aug 2025 15:36:22 +0000</pubDate>
      <link>https://dev.to/ri_hirak/using-nprogress-on-react-router-v7-1a0g</link>
      <guid>https://dev.to/ri_hirak/using-nprogress-on-react-router-v7-1a0g</guid>
      <description>&lt;p&gt;Nprogress is a popular JS library to showing beautiful progress bar. I was using simple React + Vite without any framework. With react router dom, all the pages loads within a second on link click, even though internet connection is off. Because react already loaded those through js on initial load.&lt;/p&gt;

&lt;p&gt;SEO is really hard with simple single page application. I noticed Google sometimes do not render JS, CSS assets when indexing. Because of that, no meta tags or title tags shown to Google bot.&lt;/p&gt;

&lt;p&gt;I was looking for framework that is easy to set-up. Got to know Next JS is not beginner friendly.&lt;/p&gt;

&lt;p&gt;After much research, I found Remix is now React Router v7. That was game changer for react lovers.&lt;/p&gt;

&lt;p&gt;Now I can server side render full HTML just using React Router. I started building my react router apps and it's same like Remix. But sometimes, it took 3-5 seconds to load when user clicks a link. I need a progress bar 🤔&lt;/p&gt;

&lt;p&gt;I was already familiar with Nprogress. Finally, I set-up Nprogress for my react router app with the help of Ai. 💪&lt;/p&gt;

&lt;p&gt;My project is in Typescript.&lt;/p&gt;

&lt;p&gt;Here is what to do:&lt;/p&gt;

&lt;h2&gt;
  
  
  1. Install Nprogress
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;npm install nprogress
npm install --save-dev @types/nprogress
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  2. Add Nprogress Hook
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;// app/hooks/useNProgress.ts

import { useNavigation, useFetchers } from "react-router";
import { useEffect, useRef } from "react";
import NProgress from "nprogress";
import "nprogress/nprogress.css";

export function useNProgress(delay: number = 300) {
  const navigation = useNavigation();
  const fetchers = useFetchers();

  const timerRef = useRef&amp;lt;NodeJS.Timeout | null&amp;gt;(null);
  const startedRef = useRef(false);

  // Configure NProgress once per hook instance
  useEffect(() =&amp;gt; {
    NProgress.configure({
      showSpinner: false,
      // You can add more options here like minimum, easing, speed, etc.
    });
  }, []);

  useEffect(() =&amp;gt; {
    const fetchersIdle = fetchers.every((f) =&amp;gt; f.state === "idle");

    if (navigation.state === "idle" &amp;amp;&amp;amp; fetchersIdle) {
      if (timerRef.current) {
        clearTimeout(timerRef.current);
        timerRef.current = null;
      }
      if (startedRef.current) {
        NProgress.done();
        startedRef.current = false;
      }
    } else {
      if (!timerRef.current) {
        timerRef.current = setTimeout(() =&amp;gt; {
          NProgress.start();
          startedRef.current = true;
        }, delay);
      }
    }

    return () =&amp;gt; {
      if (timerRef.current) {
        clearTimeout(timerRef.current);
        timerRef.current = null;
      }
    };
  }, [navigation.state, fetchers, delay]);

  // Also cleanup on unmount
  useEffect(() =&amp;gt; {
    return () =&amp;gt; {
      NProgress.done();
    };
  }, []);
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  3. Add Nprogress in the entry file
&lt;/h2&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;// app/root.tsx

import { useNProgress } from "@/hooks/useNProgress";

function AppProviders({ children }: { children: React.ReactNode }) {
  // Nprogress here
  useNProgress();

  return (
    &amp;lt;QueryClientProvider client={queryClient}&amp;gt;
      &amp;lt;TooltipProvider&amp;gt;
        &amp;lt;Toaster richColors /&amp;gt;
        {children}
      &amp;lt;/TooltipProvider&amp;gt;
    &amp;lt;/QueryClientProvider&amp;gt;
  );
}

export default function App() {
  return (
    &amp;lt;AppProviders&amp;gt;
      &amp;lt;Outlet /&amp;gt;
    &amp;lt;/AppProviders&amp;gt;
  );
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;You can mention custom delay with:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;useNProgress(500);
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Otherwise simply use:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;useNProgress();
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The default 300ms delay ensure that Nprogress don't appear for super fast navigation. Only start appearing if navigation take more than 300ms after link click.&lt;/p&gt;

&lt;h2&gt;
  
  
  4. Customize (Optional)
&lt;/h2&gt;

&lt;p&gt;In your app.css&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;/* Customize progress bar */
  #nprogress .bar {
    background: var(--primary) !important;
    height: 3px !important;
  }
  #nprogress .peg {
    box-shadow: 0 0 10px var(--primary), 0 0 5px var(--primary) !important;
  }
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;That's it. Now your users are ready for better navigation experience. 🥳&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>react</category>
      <category>remix</category>
      <category>javascript</category>
    </item>
    <item>
      <title>How I Made a GTA 6 Countdown Website with Ai</title>
      <dc:creator>Hirak Kalita</dc:creator>
      <pubDate>Sun, 04 May 2025 03:43:19 +0000</pubDate>
      <link>https://dev.to/ri_hirak/how-i-made-a-gta-6-countdown-website-with-ai-17mf</link>
      <guid>https://dev.to/ri_hirak/how-i-made-a-gta-6-countdown-website-with-ai-17mf</guid>
      <description>&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fdc2m4wo7n655kbwghobx.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fdc2m4wo7n655kbwghobx.jpg" alt=" " width="800" height="450"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;I recently launched a &lt;strong&gt;&lt;a href="https://gta-6-countdown.gengamer.in" rel="noopener noreferrer"&gt;GTA 6 Countdown&lt;/a&gt;&lt;/strong&gt;&lt;br&gt;
...and I’m proud to say, I built it &lt;em&gt;with the help of AI&lt;/em&gt;.&lt;/p&gt;

&lt;p&gt;I’m not a professional developer. I have &lt;strong&gt;ideas&lt;/strong&gt;, some &lt;strong&gt;problem-solving ability&lt;/strong&gt;, and a &lt;strong&gt;basic knowledge of HTML, CSS, JavaScript, and PHP&lt;/strong&gt;. But what truly made this project possible? &lt;strong&gt;AI. Specifically, ChatGPT&lt;/strong&gt;.&lt;/p&gt;

&lt;h2&gt;
  
  
  Why Build a GTA 6 Countdown?
&lt;/h2&gt;

&lt;p&gt;Like millions of fans, I’ve been waiting forever for Rockstar to finally drop GTA VI. When the release date (May 26, 2026) was confirmed, I thought:&lt;br&gt;
&lt;em&gt;“Wouldn’t it be cool to create a live countdown site for the community?”&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;It was a fun idea—but I knew it would be challenging to build on my own.&lt;/p&gt;

&lt;h2&gt;
  
  
  Enter ChatGPT: My Coding Co-Pilot
&lt;/h2&gt;

&lt;p&gt;I turned to ChatGPT and described exactly what I wanted:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;A countdown timer synced to a specific date/time&lt;/li&gt;
&lt;li&gt;A clean mobile-friendly UI&lt;/li&gt;
&lt;li&gt;Support for sharing&lt;/li&gt;
&lt;li&gt;Timezone awareness&lt;/li&gt;
&lt;li&gt;Some personality, maybe even animation&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;ChatGPT not only wrote the code but also:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Helped me debug issues I couldn’t figure out&lt;/li&gt;
&lt;li&gt;Suggested design improvements&lt;/li&gt;
&lt;li&gt;Explained how each section worked so I could learn&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Suddenly, I wasn’t just building a countdown—I was learning by building.&lt;/p&gt;

&lt;h2&gt;
  
  
  AI Doesn’t Replace Developers — It &lt;em&gt;Empowers&lt;/em&gt; Everyone
&lt;/h2&gt;

&lt;p&gt;There’s this common fear: &lt;em&gt;“AI will take developers' jobs.”&lt;/em&gt;&lt;br&gt;
But in my experience, &lt;strong&gt;AI makes every person a developer&lt;/strong&gt;—even if you’ve never written a line of code before.&lt;/p&gt;

&lt;p&gt;With tools like ChatGPT, Lovable, I went from &lt;em&gt;“I have a cool idea”&lt;/em&gt; to &lt;em&gt;“I launched a working web app”&lt;/em&gt;. And I didn’t need a full dev team to make it happen.&lt;/p&gt;

&lt;h2&gt;
  
  
  The Final Result
&lt;/h2&gt;

&lt;p&gt;You can check out the live site here:&lt;br&gt;
&lt;strong&gt;&lt;a href="https://gta-6-countdown.gengamer.in" rel="noopener noreferrer"&gt;https://gta-6-countdown.gengamer.in&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;It shows:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;A real-time global countdown&lt;/li&gt;
&lt;li&gt;Release date/time (with timezone support)&lt;/li&gt;
&lt;li&gt;Platform info (PS5, Xbox Series X/S)&lt;/li&gt;
&lt;li&gt;Mobile-optimized layout&lt;/li&gt;
&lt;li&gt;Social sharing&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  What I Learned
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;ChatGPT is not a magic wand&lt;/strong&gt;, but it’s an incredible assistant.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Knowing how to ask the right questions&lt;/strong&gt; is more valuable than memorizing syntax.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Creativity and initiative&lt;/strong&gt; are still the most important skills.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Final Thoughts
&lt;/h2&gt;

&lt;p&gt;If you’re someone with a great idea but limited coding skills—don’t wait.&lt;br&gt;
AI can turn you from dreamer to maker.&lt;/p&gt;

&lt;p&gt;I'm also thinking of add-on a live chat feature with no login require.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Build with AI. Learn with AI. Launch with AI.&lt;/strong&gt;&lt;br&gt;
Like I did.&lt;/p&gt;

&lt;p&gt;Let me know what you think of the site! And if you’ve used AI to build something awesome, drop a link—I’d love to see it.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>ai</category>
      <category>javascript</category>
    </item>
    <item>
      <title>How I made a Fully Functional WordPress Website/Theme using ChatGPT</title>
      <dc:creator>Hirak Kalita</dc:creator>
      <pubDate>Tue, 31 Oct 2023 10:59:19 +0000</pubDate>
      <link>https://dev.to/ri_hirak/how-i-made-a-fully-functional-wordpress-websitetheme-using-chatgpt-3ob4</link>
      <guid>https://dev.to/ri_hirak/how-i-made-a-fully-functional-wordpress-websitetheme-using-chatgpt-3ob4</guid>
      <description>&lt;p&gt;WordPress is a popular CMS nowadays, especially for beginners who don't want to code and just need drag-and-drop options. But when you master coding, you can take a WordPress site to the next level. In this article, I will explain how I created a WordPress theme without any PHP or JS knowledge.&lt;/p&gt;

&lt;p&gt;I started my blog on a Blogger website with a simple theme. Day by day, I posted quality content, and people began to like my posts. However, I am not entirely satisfied with my site in terms of optimization.&lt;/p&gt;

&lt;h2&gt;
  
  
  Switching between CMS (Blogger to WordPress)
&lt;/h2&gt;

&lt;p&gt;Blogger CMS is powered by Google; however, their developers don't allow PHP in the CMS. It only supports HTML, CSS, and JavaScript. Sometimes, we can use pre-built Blogger codes to handle certain outputs. My main issue is with performance and optimization for Core Web Vitals. Despite having many ideas to make my site faster, it was not possible without PHP support in the CMS.&lt;/p&gt;

&lt;p&gt;Until September 2023, I had planned to use ChatGPT as my personal coder. I have been using ChatGPT for almost 8-9 months, and I know how to write prompts to get the expected response. So, I started building the WordPress theme.&lt;/p&gt;

&lt;p&gt;Since I already have a Blogger template with pre-built CSS and HTML, I don't need to worry about the design.&lt;/p&gt;

&lt;p&gt;I began by creating basic WordPress files, such as functions.php, header.php, and footer.php. Additionally, I added author pages, category pages, and archive pages.&lt;/p&gt;

&lt;p&gt;In the header, I included a theme switch button for dark and light modes. I also made the mobile header transparent and blurry, inspired by the design of X, formerly known as Twitter. I have a dummy website where I test all the functions, and after proper implementation, I apply them to the main website.&lt;/p&gt;

&lt;p&gt;Furthermore, I added related posts based on tags and categories with proper logic to improve the website's structure. An author box was included to showcase the author's expertise.&lt;/p&gt;

&lt;p&gt;Recognizing that some readers avoid lengthy (TL;DR) articles, I drew inspiration from the GameRant website and started adding highlights at the beginning of articles. These highlights attract the reader to read the full article.&lt;/p&gt;

&lt;p&gt;Even though I don't have PHP knowledge, the website is now fully functional. The big credit goes to ChatGPT and OpenAI for making such revolution in AI world.&lt;/p&gt;

&lt;h2&gt;
  
  
  The SEO Part
&lt;/h2&gt;

&lt;p&gt;When migrating from one CMS to another, it is important to take care of the current SEO of the website. Since I have a pre-built HTML CSS structure (from my Blogger template), there won't be any changes in layout and style when migrating to WordPress.&lt;/p&gt;

&lt;p&gt;The main thing is to do with URL slug and proper 301 redirection. To maintain proper URL structure, I changed my WordPress slug permalink structure to domain name/year/month/post-title and then .html. Then added a simple functions.php code for temporary to trigger some URL Changes. A &lt;a href="https://www.wpbeginner.com/wp-tutorials/how-to-switch-from-blogger-to-wordpress-without-losing-google-rankings/" rel="noopener noreferrer"&gt;WP Beginner article&lt;/a&gt; helped me a lot to maintain proper SEO.&lt;/p&gt;

&lt;h2&gt;
  
  
  Make the Performance Light Speed⚡
&lt;/h2&gt;

&lt;p&gt;Now I have full access to the PHP language to improve performance. I have implemented various lazy loading techniques and utilized the Intersection Observer API to avoid loading images below the viewport.&lt;/p&gt;

&lt;p&gt;Next.js, React.js, Vue.js are mostly used to build high speed web apps. I frequently observe similar websites in my niche, such as IGN, Dexerto, and GAMINGbible. Most of them use different frameworks and CMSs instead of WordPress. What attracts me most to these sites is their quick routing without a full page reload. Once a user loads the site, all subsequent visits are super fast.&lt;/p&gt;

&lt;p&gt;Since I have no knowledge of Headless WordPress, I decided to go with Turbo. Hotwire Turbo does almost what I need – it replaces content within the body on subsequent visits, eliminating the need for a full page reload. Additionally, Turbo offers custom events like load, visit, and before-render, which make my sites fully functional for further navigation.&lt;/p&gt;

&lt;p&gt;Would you like to check out the site? It's called Rising Insider, where I post gaming-related content and news, especially updates on mobile games.&lt;/p&gt;

&lt;p&gt;Check my work that is live on &lt;a href="https://gengamer.in" rel="noopener noreferrer"&gt;Gen Gamer&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;If you have any questions related to my creation, then comment down below. I don't visit Dev Community very often, but I do explore the world of coding there twice a week. 🧑‍💻&lt;/p&gt;

</description>
      <category>wordpress</category>
      <category>webdev</category>
      <category>php</category>
      <category>chatgpt</category>
    </item>
  </channel>
</rss>
