<?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: RITWIKA PARUA </title>
    <description>The latest articles on DEV Community by RITWIKA PARUA  (@rit456).</description>
    <link>https://dev.to/rit456</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.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F2949229%2F78adeafa-a6e6-4a5d-9023-3dbe4aaf3208.png</url>
      <title>DEV Community: RITWIKA PARUA </title>
      <link>https://dev.to/rit456</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/rit456"/>
    <language>en</language>
    <item>
      <title>Problem faced when Tailwind CSS did not work on the screen.</title>
      <dc:creator>RITWIKA PARUA </dc:creator>
      <pubDate>Tue, 02 Jun 2026 18:06:38 +0000</pubDate>
      <link>https://dev.to/rit456/problem-faced-when-tailwind-css-did-not-work-on-the-screen-hf5</link>
      <guid>https://dev.to/rit456/problem-faced-when-tailwind-css-did-not-work-on-the-screen-hf5</guid>
      <description>&lt;p&gt;I faced a problem&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Because Tailwind CSS did not work on screen. And I struggled for a few days. The peasants became low, and anger increased. I took help from Claude AI. I do not say that I am excellent at prompt writing. I just told it what the error was showing, the screenshot, and what I wrote in code. 
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight css"&gt;&lt;code&gt;&lt;span class="nt"&gt;I&lt;/span&gt; &lt;span class="nt"&gt;learned&lt;/span&gt;&lt;span class="nd"&gt;:-&lt;/span&gt;  &lt;span class="err"&gt;1&lt;/span&gt;&lt;span class="o"&gt;)&lt;/span&gt; &lt;span class="nt"&gt;Donot&lt;/span&gt; &lt;span class="nt"&gt;use&lt;/span&gt; &lt;span class="k"&gt;@tailwind&lt;/span&gt; &lt;span class="n"&gt;base&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="k"&gt;@tailwind&lt;/span&gt; &lt;span class="n"&gt;components&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="k"&gt;@tailwind&lt;/span&gt; &lt;span class="n"&gt;utilities&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt; &lt;span class="nt"&gt;in&lt;/span&gt; &lt;span class="nt"&gt;css&lt;/span&gt; &lt;span class="nt"&gt;file&lt;/span&gt; &lt;span class="nt"&gt;because&lt;/span&gt; &lt;span class="nt"&gt;these&lt;/span&gt; &lt;span class="nt"&gt;are&lt;/span&gt; &lt;span class="nt"&gt;old&lt;/span&gt; &lt;span class="nt"&gt;version&lt;/span&gt; &lt;span class="o"&gt;(&lt;/span&gt;&lt;span class="nt"&gt;tailwind&lt;/span&gt; &lt;span class="nt"&gt;V3&lt;/span&gt;&lt;span class="o"&gt;)&lt;/span&gt; &lt;span class="nt"&gt;and&lt;/span&gt; &lt;span class="nt"&gt;now&lt;/span&gt; &lt;span class="nt"&gt;is&lt;/span&gt; &lt;span class="nt"&gt;V4&lt;/span&gt; &lt;span class="o"&gt;.&lt;/span&gt; &lt;span class="nt"&gt;Use&lt;/span&gt; &lt;span class="nt"&gt;only&lt;/span&gt; &lt;span class="err"&gt;`&lt;/span&gt;&lt;span class="k"&gt;@import&lt;/span&gt; &lt;span class="n"&gt;tailwind&lt;/span&gt;&lt;span class="err"&gt;`&lt;/span&gt; &lt;span class="p"&gt;.&lt;/span&gt; 

&lt;span class="n"&gt;The&lt;/span&gt; &lt;span class="n"&gt;mistake&lt;/span&gt; &lt;span class="p"&gt;:&lt;/span&gt;&lt;span class="n"&gt;-&lt;/span&gt; &lt;span class="n"&gt;I&lt;/span&gt; &lt;span class="n"&gt;had&lt;/span&gt; &lt;span class="n"&gt;not&lt;/span&gt; &lt;span class="n"&gt;been&lt;/span&gt; &lt;span class="n"&gt;idea&lt;/span&gt; &lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;How&lt;/span&gt; &lt;span class="n"&gt;to&lt;/span&gt; &lt;span class="n"&gt;dowloaded&lt;/span&gt; &lt;span class="n"&gt;post&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="n"&gt;css&lt;/span&gt; &lt;span class="n"&gt;file&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="n"&gt;this&lt;/span&gt; &lt;span class="n"&gt;is&lt;/span&gt; &lt;span class="n"&gt;main&lt;/span&gt; &lt;span class="n"&gt;conflict&lt;/span&gt; &lt;span class="n"&gt;not&lt;/span&gt; &lt;span class="n"&gt;to&lt;/span&gt; &lt;span class="n"&gt;display&lt;/span&gt; &lt;span class="n"&gt;on&lt;/span&gt; &lt;span class="n"&gt;screen&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt; &lt;span class="n"&gt;I&lt;/span&gt; &lt;span class="n"&gt;removed&lt;/span&gt; &lt;span class="n"&gt;then&lt;/span&gt; &lt;span class="n"&gt;all&lt;/span&gt; &lt;span class="n"&gt;set&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;





&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;But I noticed that claude said that you can use @import "tailwindcss";

`@layer base {
  body {
    @apply bg-gray-100 text-gray-900 font-sans m-0 p-0;
  }
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;

&lt;p&gt;&lt;br&gt;
&lt;code&gt;but in my css file doesnot work&lt;/code&gt;&lt;code&gt;@layer base&lt;/code&gt; &lt;br&gt;
 Can you tell me how to fix it?&lt;br&gt;
`&lt;br&gt;
&lt;strong&gt;Comment on.....&lt;/strong&gt;&lt;/p&gt;

</description>
      <category>react</category>
      <category>learning</category>
      <category>devchallenge</category>
      <category>portfolio</category>
    </item>
    <item>
      <title>1st day</title>
      <dc:creator>RITWIKA PARUA </dc:creator>
      <pubDate>Tue, 02 Jun 2026 16:07:47 +0000</pubDate>
      <link>https://dev.to/rit456/1st-day-3d79</link>
      <guid>https://dev.to/rit456/1st-day-3d79</guid>
      <description>&lt;p&gt;&lt;strong&gt;I was facing a problem&lt;/strong&gt;: my navlinks do not show on screen. I used YouTube for how to organise navlinks using the map method, but it was not working. So I asked Agent AI, "What is the problem with my code?" It gave me this code: &lt;code&gt;{navLinks.map((link, idx) =&amp;gt; {&lt;br&gt;
return &amp;lt;a href={link.href} key={idx}&amp;gt;{link.label}&amp;lt;/a&amp;gt;;&lt;br&gt;
})}&lt;/code&gt; I only did not write return. &lt;/p&gt;

&lt;p&gt;*&lt;em&gt;**Why&lt;/em&gt;*: I asked AI, why when I use return on the link, it works:- &lt;/p&gt;

&lt;p&gt;_Because of how JavaScript arrow functions work:&lt;/p&gt;

&lt;p&gt;With curly braces {} → requires explicit return:&lt;/p&gt;

&lt;p&gt;With parentheses () → implicit return (no return keyword needed):&lt;/p&gt;

&lt;p&gt;If you used =&amp;gt; {( instead of just =&amp;gt; (, that's why it failed. The parentheses must come directly after =&amp;gt; with no braces before them._&lt;/p&gt;

&lt;p&gt;*&lt;em&gt;That's why.&lt;br&gt;
*&lt;/em&gt;&lt;/p&gt;

</description>
      <category>react</category>
      <category>learning</category>
      <category>tailwindcss</category>
      <category>portfolio</category>
    </item>
    <item>
      <title>My Portfolio Journey</title>
      <dc:creator>RITWIKA PARUA </dc:creator>
      <pubDate>Tue, 02 Jun 2026 15:54:00 +0000</pubDate>
      <link>https://dev.to/rit456/my-portfolio-journey-m78</link>
      <guid>https://dev.to/rit456/my-portfolio-journey-m78</guid>
      <description>&lt;p&gt;I am creating a personal portfolio using React and tailwindcss, and then I will use MongoDB, Node with Express and AI for system design. I will share my learnings and experiences. If anyone learns from my journey, comment on .&lt;/p&gt;

</description>
      <category>mern</category>
      <category>ai</category>
      <category>javascript</category>
      <category>career</category>
    </item>
    <item>
      <title>I am facing a problem ...... If you are facing this problem, comment.....</title>
      <dc:creator>RITWIKA PARUA </dc:creator>
      <pubDate>Fri, 29 May 2026 07:27:44 +0000</pubDate>
      <link>https://dev.to/rit456/i-am-facing-a-problem-if-you-are-facing-this-problem-comment-hbd</link>
      <guid>https://dev.to/rit456/i-am-facing-a-problem-if-you-are-facing-this-problem-comment-hbd</guid>
      <description>&lt;p&gt;I followed lots of accounts on Instagram, &lt;strong&gt;for necessary&lt;/strong&gt;. But &lt;/p&gt;

&lt;h2&gt;
  
  
  I am facing a problem
&lt;/h2&gt;

&lt;p&gt;. When I want to check a particular Topic. I want to explore the particular account that I followed for that topic. However, I can't find the account because there are lots of accounts that I follow... those I followed, and I forget the name of the particular account. &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;&lt;em&gt;Can you feel/face this type of problem?&lt;/em&gt;&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;**&lt;/p&gt;

&lt;h2&gt;
  
  
  Comment on.....
&lt;/h2&gt;

&lt;p&gt;**&lt;/p&gt;

</description>
      <category>react</category>
      <category>api</category>
      <category>typescript</category>
      <category>ai</category>
    </item>
  </channel>
</rss>
