<?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: Matheus Cruz Rocha</title>
    <description>The latest articles on DEV Community by Matheus Cruz Rocha (@matheusrocha89).</description>
    <link>https://dev.to/matheusrocha89</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%2F331584%2Fc596d92c-b796-4e9a-8c6e-6281a64c24f9.jpeg</url>
      <title>DEV Community: Matheus Cruz Rocha</title>
      <link>https://dev.to/matheusrocha89</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/matheusrocha89"/>
    <language>en</language>
    <item>
      <title>React Click Edit</title>
      <dc:creator>Matheus Cruz Rocha</dc:creator>
      <pubDate>Thu, 23 Jan 2025 11:33:49 +0000</pubDate>
      <link>https://dev.to/matheusrocha89/react-click-edit-5467</link>
      <guid>https://dev.to/matheusrocha89/react-click-edit-5467</guid>
      <description>&lt;p&gt;As all of you know, I was not satisfied with finding simple React components. I saw that we have many components, but most of them forget the main goal and idea of "do just one thing, but do it well."&lt;/p&gt;

&lt;p&gt;Following the idea of creating simple components to practice publishing on the npmjs registry, configuring CI/CD, and releasing simple components by the namespace &lt;code&gt;@nobrainers&lt;/code&gt; I just released a new component "react-click-edit". &lt;/p&gt;

&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%2Fwenqwodi4b5eem7v0wio.png" 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%2Fwenqwodi4b5eem7v0wio.png" alt="React Edit Click Screenshot" width="800" height="923"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;A simple display value with an edit button so you can open an input field in the same place so you can edit and save the value. This component is a simple react component that you can click and edit the value.&lt;/p&gt;

&lt;p&gt;There are spaces to improve and my idea is to keep improving with new features or ideas but still keep the main goal that motivates me to start building these components (keeping simple and doing just one thing and doing it well).&lt;/p&gt;

&lt;p&gt;I would be really happy to hear your feedback about the component:&lt;br&gt;
&lt;a href="https://www.npmjs.com/package/@nobrainers/react-click-edit?activeTab=readme" rel="noopener noreferrer"&gt;@nobrainers/react-click-edit&lt;/a&gt;&lt;br&gt;
&lt;a href="https://github.com/matheusrocha89/react-click-edit" rel="noopener noreferrer"&gt;Github Repo&lt;/a&gt;&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>javascript</category>
      <category>programming</category>
      <category>react</category>
    </item>
    <item>
      <title>React-copytext</title>
      <dc:creator>Matheus Cruz Rocha</dc:creator>
      <pubDate>Mon, 13 Jan 2025 10:07:19 +0000</pubDate>
      <link>https://dev.to/matheusrocha89/react-copytext-4pmd</link>
      <guid>https://dev.to/matheusrocha89/react-copytext-4pmd</guid>
      <description>&lt;p&gt;It's been a long time since I created and published some packages in npmjs (when I say a long time I mean really long), and when you do these kinds of things just once in a while you forget a lot of steps.&lt;/p&gt;

&lt;p&gt;Recently I was checking if I could find one of those components that you have a text inside a box and a button to copy text that copies the content to your clipboard. It's a simple component, really easy to build but I checked if I could find one that already exists and I couldn't find a good one (maybe it exists but is not indexed properly on the internet). These days we have a lot of components that add so much complexity to use because it has tons of features and we just want a simple one that does what it promises in a simple well, which means doing one task really well. So I thought "Maybe it's a good opportunity to build one and practice the whole workflow of publishing a package on the npmjs with automatic deploy and so on". And that's what I did.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://github.com/matheusrocha89/react-copytext" rel="noopener noreferrer"&gt;Github&lt;/a&gt;&lt;br&gt;
&lt;a href="https://www.npmjs.com/package/@nobrainers/react-copytext" rel="noopener noreferrer"&gt;NpmJs&lt;/a&gt;&lt;/p&gt;

&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%2Flku2p1ea5i0h0466nn11.png" 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%2Flku2p1ea5i0h0466nn11.png" alt="Project readme image" width="800" height="821"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Yesterday I released "&lt;a href="https://github.com/matheusrocha89/react-copytext" rel="noopener noreferrer"&gt;react-copytext&lt;/a&gt;" under the namespace @nobrainers, my idea is to release more of those simple and easy-to-use components that are easy to build but not because it's easy doesn't mean it does not cost you some time to make them.&lt;/p&gt;

&lt;p&gt;I am open to your feedback and appreciate that you spent some time reading this post. I am open to ideas about new components to put in this @nobrainers namespace.&lt;/p&gt;

&lt;p&gt;Thanks for your attention.&lt;/p&gt;

</description>
      <category>react</category>
      <category>frontend</category>
      <category>reactjsdevelopment</category>
      <category>typescript</category>
    </item>
  </channel>
</rss>
