<?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: Hamza</title>
    <description>The latest articles on DEV Community by Hamza (@hamzatopo).</description>
    <link>https://dev.to/hamzatopo</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%2F279771%2F00688416-efc6-4218-926f-dc68a555bd51.png</url>
      <title>DEV Community: Hamza</title>
      <link>https://dev.to/hamzatopo</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/hamzatopo"/>
    <language>en</language>
    <item>
      <title>After Years of Building, Fixing, and Supporting Production Systems, I’m Looking for My Next Opportunity</title>
      <dc:creator>Hamza</dc:creator>
      <pubDate>Wed, 23 Sep 2026 18:44:02 +0000</pubDate>
      <link>https://dev.to/hamzatopo/after-years-of-building-fixing-and-supporting-production-systems-im-looking-for-my-next-che</link>
      <guid>https://dev.to/hamzatopo/after-years-of-building-fixing-and-supporting-production-systems-im-looking-for-my-next-che</guid>
      <description>&lt;p&gt;Hi DEV Community,&lt;/p&gt;

&lt;p&gt;I hesitated before writing this post.&lt;/p&gt;

&lt;p&gt;For years, I was used to being the person people called when something had to be built, fixed, investigated, deployed, or understood.&lt;/p&gt;

&lt;p&gt;Today, I’m on the other side of that experience.&lt;/p&gt;

&lt;p&gt;I’m looking for work.&lt;/p&gt;

&lt;p&gt;And after months of applications, silence can become surprisingly heavy.&lt;/p&gt;

&lt;p&gt;A little about me&lt;/p&gt;

&lt;p&gt;My name is Hamza AIT-SIDI-SAID. I’m a software engineer from Morocco with more than six years of experience in web development.&lt;/p&gt;

&lt;p&gt;My main stack is:&lt;/p&gt;

&lt;p&gt;PHP · Symfony · Laravel · SQL · REST APIs · React · Git · CI/CD · Docker · Linux&lt;/p&gt;

&lt;p&gt;But those technologies only tell a small part of the story.&lt;/p&gt;

&lt;p&gt;During my most recent experience at Capgemini Morocco, I worked on enterprise applications for clients including ENGIE and UGI / Antargaz.&lt;/p&gt;

&lt;p&gt;These were not side projects or tutorials.&lt;/p&gt;

&lt;p&gt;They were real production systems, used by real businesses, where bugs had consequences and where reliability mattered.&lt;/p&gt;

&lt;p&gt;I worked on application development, APIs, SQL optimization, production support, deployments, incident resolution, CI/CD, code reviews, application maintenance, and technical troubleshooting.&lt;/p&gt;

&lt;p&gt;I also had the opportunity to support junior developers and share knowledge with the team.&lt;/p&gt;

&lt;p&gt;There were days when everything worked normally.&lt;/p&gt;

&lt;p&gt;And there were other days when a production incident appeared, something broke unexpectedly, or an application needed to go live.&lt;/p&gt;

&lt;p&gt;Those moments taught me something that no framework documentation can teach:&lt;/p&gt;

&lt;p&gt;software engineering is not only about writing code.&lt;/p&gt;

&lt;p&gt;It is also about staying calm when something breaks.&lt;/p&gt;

&lt;p&gt;Understanding systems you did not originally build.&lt;/p&gt;

&lt;p&gt;Reading logs.&lt;/p&gt;

&lt;p&gt;Asking the right questions.&lt;/p&gt;

&lt;p&gt;Helping teammates.&lt;/p&gt;

&lt;p&gt;Taking responsibility.&lt;/p&gt;

&lt;p&gt;And sometimes spending hours chasing one small detail that turns out to be the entire problem.&lt;/p&gt;

&lt;p&gt;Then suddenly, everything became quiet&lt;/p&gt;

&lt;p&gt;My latest professional chapter ended in 2026.&lt;/p&gt;

&lt;p&gt;I expected that with several years of experience, enterprise projects, production experience, and a solid technical background, finding the next opportunity would be relatively straightforward.&lt;/p&gt;

&lt;p&gt;It hasn't been.&lt;/p&gt;

&lt;p&gt;I have applied.&lt;/p&gt;

&lt;p&gt;I have rewritten my CV.&lt;/p&gt;

&lt;p&gt;I have adjusted my LinkedIn profile.&lt;/p&gt;

&lt;p&gt;I have searched locally and internationally.&lt;/p&gt;

&lt;p&gt;I have explored remote roles, freelance opportunities, relocation opportunities, and traditional employment.&lt;/p&gt;

&lt;p&gt;And sometimes the answer is simply silence.&lt;/p&gt;

&lt;p&gt;No rejection.&lt;/p&gt;

&lt;p&gt;No technical interview.&lt;/p&gt;

&lt;p&gt;No feedback.&lt;/p&gt;

&lt;p&gt;Just silence.&lt;/p&gt;

&lt;p&gt;I won't pretend that this is easy.&lt;/p&gt;

&lt;p&gt;When you spend years being useful to teams and suddenly struggle to get even the first conversation, you start questioning things you never questioned before.&lt;/p&gt;

&lt;p&gt;Your experience.&lt;/p&gt;

&lt;p&gt;Your skills.&lt;/p&gt;

&lt;p&gt;Your decisions.&lt;/p&gt;

&lt;p&gt;Sometimes even your value as an engineer.&lt;/p&gt;

&lt;p&gt;But I also know what I have done.&lt;/p&gt;

&lt;p&gt;I know the systems I have supported.&lt;/p&gt;

&lt;p&gt;I know the incidents I have solved.&lt;/p&gt;

&lt;p&gt;I know the applications I have helped deliver.&lt;/p&gt;

&lt;p&gt;I know how many times I had to learn something quickly because production could not wait.&lt;/p&gt;

&lt;p&gt;So instead of keeping this search private, I decided to write this post.&lt;/p&gt;

&lt;p&gt;What I can bring to a team&lt;/p&gt;

&lt;p&gt;I’m particularly comfortable working on:&lt;/p&gt;

&lt;p&gt;PHP and Symfony applications&lt;br&gt;
Laravel projects&lt;br&gt;
REST APIs and system integrations&lt;br&gt;
MySQL, Oracle, PostgreSQL and SQL troubleshooting&lt;br&gt;
Existing and legacy applications&lt;br&gt;
Production incident investigation&lt;br&gt;
Application maintenance and modernization&lt;br&gt;
CI/CD pipelines&lt;br&gt;
Backend architecture&lt;br&gt;
Performance investigation&lt;br&gt;
Code reviews&lt;br&gt;
React when a project requires full-stack work&lt;br&gt;
Technical support for business-critical applications&lt;/p&gt;

&lt;p&gt;I am also comfortable joining an existing project.&lt;/p&gt;

&lt;p&gt;I don't need everything to be greenfield.&lt;/p&gt;

&lt;p&gt;Actually, some of the work I enjoy most is opening an unfamiliar codebase, understanding how it works, identifying where the problems are, and gradually making it better.&lt;/p&gt;

&lt;p&gt;What I am looking for&lt;/p&gt;

&lt;p&gt;I am currently open to:&lt;/p&gt;

&lt;p&gt;Full-time positions&lt;br&gt;
Remote work&lt;br&gt;
Freelance missions&lt;br&gt;
Contract work&lt;br&gt;
Short-term projects&lt;br&gt;
Backend PHP / Symfony roles&lt;br&gt;
Full-stack PHP / React roles&lt;br&gt;
International opportunities&lt;br&gt;
Relocation opportunities&lt;/p&gt;

&lt;p&gt;I am based in Morocco, but geography is not a limitation for the right collaboration.&lt;/p&gt;

&lt;p&gt;If a company has an old PHP application nobody wants to touch anymore, I can help.&lt;/p&gt;

&lt;p&gt;If a Symfony application needs new features, I can help.&lt;/p&gt;

&lt;p&gt;If APIs need to be built or fixed, I can help.&lt;/p&gt;

&lt;p&gt;If production issues keep returning, I can investigate them.&lt;/p&gt;

&lt;p&gt;If your team has accumulated months of technical backlog, I can help reduce it.&lt;/p&gt;

&lt;p&gt;And if you simply need another experienced engineer who can join a team, understand the context, and start contributing, I would be happy to have that conversation.&lt;/p&gt;

&lt;p&gt;Why I am writing this publicly&lt;/p&gt;

&lt;p&gt;Normally, job searches happen quietly.&lt;/p&gt;

&lt;p&gt;You send applications.&lt;/p&gt;

&lt;p&gt;Recruiters receive them.&lt;/p&gt;

&lt;p&gt;Algorithms rank them.&lt;/p&gt;

&lt;p&gt;ATS systems parse them.&lt;/p&gt;

&lt;p&gt;And somewhere behind all of that is a human being.&lt;/p&gt;

&lt;p&gt;So I wanted to try something different.&lt;/p&gt;

&lt;p&gt;I'm putting my story here.&lt;/p&gt;

&lt;p&gt;Maybe a CTO reads this.&lt;/p&gt;

&lt;p&gt;Maybe a recruiter sees it.&lt;/p&gt;

&lt;p&gt;Maybe another developer knows a team looking for someone.&lt;/p&gt;

&lt;p&gt;Maybe someone has a Symfony project that has been sitting unfinished for months.&lt;/p&gt;

&lt;p&gt;Or perhaps somebody simply shares this post with the right person.&lt;/p&gt;

&lt;p&gt;Sometimes careers change because of one conversation.&lt;/p&gt;

&lt;p&gt;I'm looking for that conversation.&lt;/p&gt;

&lt;p&gt;If you can help&lt;/p&gt;

&lt;p&gt;You don't have to offer me a job.&lt;/p&gt;

&lt;p&gt;If you know someone who is hiring, sharing this post is already useful.&lt;/p&gt;

&lt;p&gt;If your company needs a PHP/Symfony engineer, feel free to contact me.&lt;/p&gt;

&lt;p&gt;If you have a freelance project, even a small one, I am open to discussing it.&lt;/p&gt;

&lt;p&gt;And if you are another developer going through the same silence after months of applications:&lt;/p&gt;

&lt;p&gt;I understand it much better now.&lt;/p&gt;

&lt;p&gt;Keep building.&lt;/p&gt;

&lt;p&gt;Keep learning.&lt;/p&gt;

&lt;p&gt;Keep showing your work.&lt;/p&gt;

&lt;p&gt;Eventually, someone has to open the door.&lt;/p&gt;

&lt;p&gt;For me, this post is another knock on that door.&lt;/p&gt;

&lt;p&gt;Contact&lt;/p&gt;

&lt;p&gt;Hamza AIT-SIDI-SAID&lt;/p&gt;

&lt;p&gt;Software Engineer&lt;br&gt;
PHP · Symfony · Laravel · React · REST APIs · SQL · CI/CD&lt;/p&gt;

&lt;p&gt;🌍 Morocco — Open to remote work and relocation&lt;/p&gt;

&lt;p&gt;🔗 Portfolio: ait-sidi-said.work&lt;/p&gt;

&lt;p&gt;🔗 LinkedIn: &lt;a href="https://www.linkedin.com/in/hamza-ait-sidi-said/" rel="noopener noreferrer"&gt;https://www.linkedin.com/in/hamza-ait-sidi-said/&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;🔗 GitHub: &lt;a href="https://github.com/hamza-topo" rel="noopener noreferrer"&gt;https://github.com/hamza-topo&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;📧 Email: &lt;a href="mailto:hamzaaitsidisaid11@outlook.com"&gt;hamzaaitsidisaid11@outlook.com&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Thank you for reading.&lt;/p&gt;

&lt;p&gt;And if you know someone who might need my experience, I would genuinely appreciate you sending this post their way.&lt;/p&gt;

</description>
      <category>career</category>
      <category>php</category>
      <category>symfony</category>
      <category>webdev</category>
    </item>
    <item>
      <title>I Built CaptureKit: A Privacy-First Browser Capture Extension</title>
      <dc:creator>Hamza</dc:creator>
      <pubDate>Tue, 08 Sep 2026 16:21:37 +0000</pubDate>
      <link>https://dev.to/hamzatopo/i-built-capturekit-a-privacy-first-browser-capture-extension-45lm</link>
      <guid>https://dev.to/hamzatopo/i-built-capturekit-a-privacy-first-browser-capture-extension-45lm</guid>
      <description>&lt;p&gt;I recently built &lt;strong&gt;&lt;a href="https://chromewebstore.google.com/detail/capturekit/ejhlomdifiimgcfgmjbjaianmafjpokp" rel="noopener noreferrer"&gt;CaptureKit&lt;/a&gt;&lt;/strong&gt;, a browser extension for capturing web content without sending it to a remote server.&lt;/p&gt;

&lt;p&gt;The idea was simple: I wanted one lightweight tool for the three capture actions I use most often:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Full-page screenshots&lt;/li&gt;
&lt;li&gt;Selected-area screenshots&lt;/li&gt;
&lt;li&gt;Short tab recordings&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Why build another capture extension?
&lt;/h2&gt;

&lt;p&gt;There are already many screenshot tools available, but I wanted CaptureKit to follow a &lt;strong&gt;local-first approach&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;Captured content is processed locally in the browser. There is no account requirement, no cloud upload for captures, no analytics, and no advertising.&lt;/p&gt;

&lt;p&gt;Short recordings are temporarily stored in the browser and automatically expire after 5 minutes.&lt;/p&gt;

&lt;h2&gt;
  
  
  The technical side
&lt;/h2&gt;

&lt;p&gt;CaptureKit is built with:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;WXT&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;React&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;TypeScript&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;IndexedDB&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;Browser Extension APIs&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;MediaRecorder&lt;/strong&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;One interesting challenge was supporting multiple browsers.&lt;/p&gt;

&lt;p&gt;Chromium-based browsers can use &lt;code&gt;tabCapture&lt;/code&gt; for tab recording, while Firefox requires a different approach using its native display-media selection flow.&lt;/p&gt;

&lt;p&gt;Full-page screenshots also required handling scrolling, viewport segmentation, device pixel ratio, image stitching, and restoring the page correctly after capture.&lt;/p&gt;

&lt;h2&gt;
  
  
  What CaptureKit can do
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Full Page
&lt;/h3&gt;

&lt;p&gt;Capture an entire webpage, including content outside the visible viewport.&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.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fgfru0dixhl2ve8qanx4b.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.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fgfru0dixhl2ve8qanx4b.png" alt=" " width="799" height="500"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  Selected Area
&lt;/h3&gt;

&lt;p&gt;Draw a selection directly on the page and capture only that region.&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.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F5e9m2waoncbo7gd648yq.jpeg" 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.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F5e9m2waoncbo7gd648yq.jpeg" alt=" " width="640" height="400"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  Record Tab
&lt;/h3&gt;

&lt;p&gt;Create a short recording of a browser tab, with a maximum duration of 60 seconds.&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.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Ftkx7jhagw61wdlgi2vv7.jpeg" 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.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Ftkx7jhagw61wdlgi2vv7.jpeg" alt=" " width="640" height="400"&gt;&lt;/a&gt;&lt;br&gt;
Captures can then be previewed, copied, downloaded, or deleted locally.&lt;/p&gt;

&lt;h2&gt;
  
  
  Building for Chrome, Edge, and Firefox
&lt;/h2&gt;

&lt;p&gt;One of my goals was to avoid maintaining three completely separate extensions.&lt;/p&gt;

&lt;p&gt;WXT made it possible to share most of the codebase while still handling browser-specific behavior where necessary.&lt;/p&gt;

&lt;p&gt;The project currently targets:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Chrome&lt;/li&gt;
&lt;li&gt;Microsoft Edge&lt;/li&gt;
&lt;li&gt;Firefox&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;I'm now going through the store publication process and testing the extension across the three browsers.&lt;/p&gt;

&lt;h2&gt;
  
  
  What's next?
&lt;/h2&gt;

&lt;p&gt;The current focus is reliability: testing different websites, zoom levels, high-DPI displays, long pages, recording permissions, and browser-specific edge cases.&lt;/p&gt;

&lt;p&gt;This project has also been a useful exercise in understanding how modern browser extension APIs differ between Chromium and Firefox.&lt;/p&gt;

&lt;p&gt;If you work with browser extensions, I'd be interested to hear about the cross-browser issues you've encountered.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>javascript</category>
      <category>browserextensions</category>
      <category>productivity</category>
    </item>
    <item>
      <title>I built SketchStash — a small tool to store terminal commands and dev snippets</title>
      <dc:creator>Hamza</dc:creator>
      <pubDate>Sun, 15 Mar 2026 04:52:27 +0000</pubDate>
      <link>https://dev.to/hamzatopo/i-built-sketchstash-a-small-tool-to-store-terminal-commands-and-dev-snippets-17n3</link>
      <guid>https://dev.to/hamzatopo/i-built-sketchstash-a-small-tool-to-store-terminal-commands-and-dev-snippets-17n3</guid>
      <description>&lt;p&gt;Hi devs 👋&lt;/p&gt;

&lt;p&gt;I built a small tool called SketchStash to store terminal commands, snippets and technical notes in one clean workspace.&lt;/p&gt;

&lt;p&gt;Instead of losing commands in terminal history, the idea is to keep everything searchable and organized.&lt;/p&gt;

&lt;p&gt;Current features:&lt;br&gt;
• Code snippet editor&lt;br&gt;
• Command search&lt;br&gt;
• Tag system&lt;br&gt;
• Pagination&lt;br&gt;
• Focus audio player&lt;br&gt;
• Dark / light theme&lt;br&gt;
• Responsive UI&lt;/p&gt;

&lt;p&gt;Stack:&lt;br&gt;
React + TypeScript&lt;br&gt;
Symfony API&lt;br&gt;
Docker&lt;br&gt;
MySQL&lt;/p&gt;

&lt;p&gt;Coming soon:&lt;br&gt;
Auth (register/login)&lt;br&gt;
Tag management&lt;br&gt;
Bulk delete&lt;/p&gt;

&lt;p&gt;Would love your feedback 🙌&lt;/p&gt;

&lt;p&gt;Live demo:&lt;br&gt;
&lt;a href="https://sketchstash.online" rel="noopener noreferrer"&gt;https://sketchstash.online&lt;/a&gt;&lt;/p&gt;

</description>
      <category>react</category>
      <category>symfony</category>
      <category>webdev</category>
      <category>productivity</category>
    </item>
    <item>
      <title>I built a tiny Linux tool that shouts “FAHH” when I type the wrong command</title>
      <dc:creator>Hamza</dc:creator>
      <pubDate>Thu, 05 Mar 2026 13:53:48 +0000</pubDate>
      <link>https://dev.to/hamzatopo/i-built-a-tiny-linux-tool-that-shouts-fahh-when-i-type-the-wrong-command-3fio</link>
      <guid>https://dev.to/hamzatopo/i-built-a-tiny-linux-tool-that-shouts-fahh-when-i-type-the-wrong-command-3fio</guid>
      <description>&lt;h1&gt;
  
  
  I built a tiny Linux tool that shouts “FAHH” when I type the wrong command
&lt;/h1&gt;

&lt;p&gt;A few weeks ago I noticed something about the way I work in the terminal.&lt;/p&gt;

&lt;p&gt;When I’m focused and typing commands fast, I tend to make a lot of small mistakes.&lt;/p&gt;

&lt;p&gt;Wrong command.&lt;br&gt;&lt;br&gt;
Misspelled command.&lt;br&gt;&lt;br&gt;
Sometimes I just type something that doesn't exist.&lt;/p&gt;

&lt;p&gt;And the terminal just replies with the usual:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="nb"&gt;command &lt;/span&gt;not found
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;That message is… boring.&lt;/p&gt;

&lt;p&gt;And also very easy to ignore.&lt;/p&gt;

&lt;p&gt;So I started thinking:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;What if the terminal could actually &lt;strong&gt;react&lt;/strong&gt; when I type something wrong?&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;Not visually.&lt;br&gt;&lt;br&gt;
Not with an error popup.&lt;/p&gt;

&lt;p&gt;But with &lt;strong&gt;sound&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;Something dramatic.&lt;/p&gt;

&lt;p&gt;Something like:&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;FAHH.&lt;/strong&gt;&lt;/p&gt;


&lt;h2&gt;
  
  
  The idea
&lt;/h2&gt;

&lt;p&gt;I wanted something very simple:&lt;/p&gt;

&lt;p&gt;Whenever I type a command that doesn't exist in the terminal, play a sound.&lt;/p&gt;

&lt;p&gt;Nothing fancy.&lt;br&gt;&lt;br&gt;
Just a tiny reaction that reminds me:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;"Hey… that command doesn't exist."&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;I initially looked for something like this inside &lt;strong&gt;VSCode extensions&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;There were some interesting ones, but they only worked inside the editor terminal.&lt;/p&gt;

&lt;p&gt;I wanted something that works everywhere:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;WSL
&lt;/li&gt;
&lt;li&gt;Debian
&lt;/li&gt;
&lt;li&gt;normal Linux terminals
&lt;/li&gt;
&lt;li&gt;zsh
&lt;/li&gt;
&lt;li&gt;bash
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Basically &lt;strong&gt;anything I run in the shell&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;So I decided to build a tiny CLI tool for it.&lt;/p&gt;


&lt;h2&gt;
  
  
  The result
&lt;/h2&gt;

&lt;p&gt;I ended up creating a small tool called:&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;fahhctl&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;What it does is very simple.&lt;/p&gt;

&lt;p&gt;When you type a command that doesn't exist:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;fakecommand
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;You still see the normal error message:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="nb"&gt;command &lt;/span&gt;not found: fakecommand
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;But you also hear:&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;FAHH 🔊&lt;/strong&gt;&lt;/p&gt;




&lt;h2&gt;
  
  
  How it works
&lt;/h2&gt;

&lt;p&gt;The tool installs a small hook into your shell configuration.&lt;/p&gt;

&lt;p&gt;When the shell detects a command that doesn't exist, it simply runs:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;fahhctl play
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Which plays a sound file.&lt;/p&gt;

&lt;p&gt;That’s it.&lt;/p&gt;

&lt;p&gt;No background process.&lt;br&gt;&lt;br&gt;
No daemon.&lt;br&gt;&lt;br&gt;
Just a tiny hook and a sound.&lt;/p&gt;


&lt;h2&gt;
  
  
  Installation
&lt;/h2&gt;

&lt;p&gt;If you're curious and want to try it:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;curl &lt;span class="nt"&gt;-fsSL&lt;/span&gt; https://raw.githubusercontent.com/hamza-topo/fahhctl/main/install.sh | bash
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Then reload your shell:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;&lt;span class="nb"&gt;source&lt;/span&gt; ~/.zshrc
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Now try typing something wrong.&lt;/p&gt;




&lt;h2&gt;
  
  
  Customize the sound
&lt;/h2&gt;

&lt;p&gt;The default sound is a dramatic &lt;strong&gt;FAHH&lt;/strong&gt;, but you can replace it with anything.&lt;/p&gt;

&lt;p&gt;The sound file lives here:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;~/.local/share/fahh/fahh.mp3
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;So you can replace it with:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;a meme sound
&lt;/li&gt;
&lt;li&gt;a warning beep
&lt;/li&gt;
&lt;li&gt;a voice saying "wrong command"
&lt;/li&gt;
&lt;li&gt;whatever you want&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  Why I actually like this
&lt;/h2&gt;

&lt;p&gt;It sounds silly, but it’s surprisingly useful.&lt;/p&gt;

&lt;p&gt;The sound acts like a &lt;strong&gt;tiny feedback loop&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;Instead of silently ignoring mistakes, the terminal gives a quick reaction.&lt;/p&gt;

&lt;p&gt;It helps me stay a bit more focused when I’m typing commands fast.&lt;/p&gt;

&lt;p&gt;Also… it's just fun.&lt;/p&gt;




&lt;h2&gt;
  
  
  The project
&lt;/h2&gt;

&lt;p&gt;If you're curious about the code or want to try it:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://github.com/hamza-topo/fahhctl" rel="noopener noreferrer"&gt;https://github.com/hamza-topo/fahhctl&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;It's a very small project, but it was fun to build.&lt;/p&gt;

&lt;p&gt;And sometimes the smallest tools are the most satisfying ones.&lt;/p&gt;

</description>
      <category>cli</category>
      <category>linux</category>
      <category>showdev</category>
      <category>tooling</category>
    </item>
    <item>
      <title>React js &amp; Github actions</title>
      <dc:creator>Hamza</dc:creator>
      <pubDate>Thu, 05 Sep 2024 08:57:44 +0000</pubDate>
      <link>https://dev.to/hamzatopo/react-js-github-actions-321e</link>
      <guid>https://dev.to/hamzatopo/react-js-github-actions-321e</guid>
      <description>&lt;h2&gt;
  
  
  Introduction
&lt;/h2&gt;

&lt;p&gt;Hey there, fellow developers! 🎉 Let's get your React app out into the world! 🚀 Today, we're going to deploy it to GitHub Pages, a super easy way to share your creations with everyone.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Step 1: Create Your GitHub Repository&lt;/strong&gt;: (skipp this if you alread have done this)&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Head over to GitHub and click the "New" button.&lt;/li&gt;
&lt;li&gt;Name your repository (let's call it react-awesome-app).&lt;/li&gt;
&lt;li&gt;(Optional) Add a description.&lt;/li&gt;
&lt;li&gt;Choose "Public" visibility.&lt;/li&gt;
&lt;li&gt;Click "Create repository".&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Step 2: Set Up Your Local React Project&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Open your terminal and run &lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;npx create-react-app react-awesome-app&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;Navigate to your project:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;cd react-awesome-app&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;&lt;strong&gt;Step 3: Connect Your Local Project to GitHub&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Initialize Git: &lt;/li&gt;
&lt;/ul&gt;

&lt;blockquote&gt;
&lt;p&gt;git init.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Add all files: &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;git add .&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Commit changes: &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;git commit -m 'Initial commit'&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Create a main branch: &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;git branch -M main&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Add the remote:&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;git remote add origin &lt;a href="https://github.com/%7Byour-github-username%7D/react-awesome-app.git" rel="noopener noreferrer"&gt;https://github.com/{your-github-username}/react-awesome-app.git&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Push to GitHub: &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;git push -u origin main&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;&lt;strong&gt;Step 4: Build for Deployment&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Run &lt;code&gt;npm start&lt;/code&gt; to check everything works.&lt;br&gt;
Create a production build: &lt;code&gt;npm run build&lt;/code&gt;&lt;br&gt;
&lt;strong&gt;Step 5: Configure GitHub Pages&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Open package.json.&lt;br&gt;
Add homepage:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;code&gt;"homepage": "https://{your-github-username}.github.io/react-awesome-app"&lt;/code&gt;&lt;br&gt;
Step 6: Deploy Your App&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;Install gh-pages: &lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;npm install gh-pages --save-dev&lt;br&gt;
Add scripts to package.json:&lt;br&gt;
&lt;code&gt;"scripts": {&lt;br&gt;
  "predeploy": "npm run build",&lt;br&gt;
  "deploy": "gh-pages -d build"&lt;br&gt;
}&lt;/code&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;Deploy: &lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;npm run deploy&lt;br&gt;
That's it! 🎉 Your app is now live on GitHub Pages. Share the link with the world!&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;The public link for your application will be : &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;react-awesome-app to be replaced by your github repo name
https://{username}.github.io/{repository-name}/&lt;/li&gt;
&lt;/ul&gt;

</description>
    </item>
    <item>
      <title>Laravel : DESIGN PATTERN REPOSITORY</title>
      <dc:creator>Hamza</dc:creator>
      <pubDate>Tue, 06 Feb 2024 11:54:06 +0000</pubDate>
      <link>https://dev.to/hamzatopo/laravel-design-pattern-repository-4m7f</link>
      <guid>https://dev.to/hamzatopo/laravel-design-pattern-repository-4m7f</guid>
      <description>&lt;p&gt;🏠 &lt;strong&gt;Short Story:&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;I vividly recall my initial encounter with the term "Design Pattern" – a moment of profound confusion as I grappled with whether it was a mere philosophical concept or a collection of abstract theories. The burning question in my mind was: how could such a concept be practically applied to something as tangible as my to-do list project 😅?&lt;/p&gt;

&lt;p&gt;As it turns out, design patterns are not elusive philosophies; instead, they are a set of solutions crafted to address recurring problems encountered during the software design process. These solutions present a structured approach to overcome common challenges, equipping developers with established and efficient methods to handle issues that frequently arise during coding.&lt;/p&gt;

&lt;p&gt;One of the most renowned examples of a design pattern is the Singleton pattern. Imagine creating a new instance of a MySQL database connection for every single request – not only is it inefficient, but it's also downright impractical. Enter the Singleton pattern, which ensures that only one instance of an object (such as a database connection) is created, streamlining operations and optimizing resource usage.&lt;/p&gt;

&lt;p&gt;Certainly! Today, let's delve into one of the essential design patterns within the context of the Laravel framework: the Repository Design Pattern.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Repository Design Pattern:&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;The Repository Design Pattern, a structural pattern, serves to separate the logic responsible for retrieving data from the underlying storage (such as a database) from the rest of the application. In Laravel, this pattern is frequently employed to interact with database models.&lt;/p&gt;

&lt;p&gt;In simpler terms, we introduce an intermediary layer between my &lt;code&gt;UserController&lt;/code&gt; and &lt;code&gt;UserModel&lt;/code&gt;, which I'll refer to as &lt;code&gt;UserRepository&lt;/code&gt;. Familiar with CRUD methods, right? Well, let's consolidate them within &lt;code&gt;UserRepository&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;In my projects, I typically initiate the development process by establishing a dedicated folder named "Repositories" within the "app" directory. The next step is to create a PHP interface; I can name it &lt;code&gt;RepositoryInterface.php&lt;/code&gt;:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight php"&gt;&lt;code&gt;&lt;span class="kn"&gt;namespace&lt;/span&gt; &lt;span class="nn"&gt;App\Repositories&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;span class="kn"&gt;use&lt;/span&gt; &lt;span class="nc"&gt;Illuminate\Database\Eloquent\Collection&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;span class="kd"&gt;interface&lt;/span&gt; &lt;span class="nc"&gt;RepositoryInterface&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="cd"&gt;/**
     * create method
     * 
     * @author Topo &amp;lt;topo@test.com&amp;gt;
     * @param  mixed $model
     */&lt;/span&gt;
    &lt;span class="k"&gt;public&lt;/span&gt; &lt;span class="k"&gt;function&lt;/span&gt; &lt;span class="n"&gt;create&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="kt"&gt;array&lt;/span&gt; &lt;span class="nv"&gt;$model&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This interface serves as a blueprint containing prototypes for essential CRUD (Create, Read, Update, Delete) methods. These methods act as the foundation for implementing the repository design pattern, and for now, we will just use the &lt;code&gt;create&lt;/code&gt; method.&lt;/p&gt;

&lt;p&gt;Next, let's define our &lt;code&gt;UserRepository&lt;/code&gt; class. To do so, let's create this class and implement the &lt;code&gt;RepositoryInterface&lt;/code&gt;:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight php"&gt;&lt;code&gt;&lt;span class="kn"&gt;namespace&lt;/span&gt; &lt;span class="nn"&gt;App\Repositories&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;span class="kn"&gt;use&lt;/span&gt; &lt;span class="nc"&gt;App\Models\User&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;span class="kd"&gt;class&lt;/span&gt; &lt;span class="nc"&gt;UserRepository&lt;/span&gt; &lt;span class="kd"&gt;implements&lt;/span&gt; &lt;span class="nc"&gt;RepositoryInterface&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;

    &lt;span class="k"&gt;public&lt;/span&gt; &lt;span class="k"&gt;function&lt;/span&gt; &lt;span class="n"&gt;create&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="kt"&gt;array&lt;/span&gt; &lt;span class="nv"&gt;$user&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
    &lt;span class="p"&gt;{&lt;/span&gt;
        &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nc"&gt;User&lt;/span&gt;&lt;span class="o"&gt;::&lt;/span&gt;&lt;span class="nf"&gt;create&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nv"&gt;$user&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Isn't that easy? Can you see how much your code looks well-separated, readable, and easy to maintain?&lt;/p&gt;

&lt;p&gt;The question now is, how can I call this repository in my controller? Well, it's not a big deal. This is where we can use Dependency Injection (DI). In the code below:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight php"&gt;&lt;code&gt;&lt;span class="kn"&gt;namespace&lt;/span&gt; &lt;span class="nn"&gt;App\Http\Controllers&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;span class="kn"&gt;use&lt;/span&gt; &lt;span class="nc"&gt;App\Repositories\UserRepository&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;

&lt;span class="kd"&gt;class&lt;/span&gt; &lt;span class="nc"&gt;UserController&lt;/span&gt; &lt;span class="kd"&gt;extends&lt;/span&gt; &lt;span class="nc"&gt;Controller&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;

&lt;span class="c1"&gt;//since im using php 8.x im allowed to use this syntax 😅&lt;/span&gt;
    &lt;span class="k"&gt;public&lt;/span&gt; &lt;span class="k"&gt;function&lt;/span&gt; &lt;span class="n"&gt;__construct&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="k"&gt;protected&lt;/span&gt; &lt;span class="kt"&gt;UserRepository&lt;/span&gt; &lt;span class="nv"&gt;$userRepository&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
    &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;

    &lt;span class="k"&gt;public&lt;/span&gt; &lt;span class="k"&gt;function&lt;/span&gt; &lt;span class="n"&gt;store&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="kt"&gt;Request&lt;/span&gt; &lt;span class="nv"&gt;$request&lt;/span&gt;&lt;span class="p"&gt;){&lt;/span&gt;
        &lt;span class="c1"&gt;// Validate your request &lt;/span&gt;
        &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nv"&gt;$this&lt;/span&gt;&lt;span class="o"&gt;-&amp;gt;&lt;/span&gt;&lt;span class="n"&gt;userRepository&lt;/span&gt;&lt;span class="o"&gt;-&amp;gt;&lt;/span&gt;&lt;span class="nf"&gt;create&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nv"&gt;$request&lt;/span&gt;&lt;span class="o"&gt;-&amp;gt;&lt;/span&gt;&lt;span class="nf"&gt;all&lt;/span&gt;&lt;span class="p"&gt;());&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Conclusion 👋&lt;/strong&gt;&lt;br&gt;
In conclusion, the Repository Design Pattern proves to be a powerful and indispensable tool for enhancing the readability of your code and adhering to the Single Responsibility Principle. By adopting this pattern, you can achieve a clean and modular architecture, keeping the logic responsible for data retrieval neatly separated from the rest of your application.&lt;/p&gt;

&lt;p&gt;The introduction of the intermediary layer, such as the &lt;code&gt;UserRepository&lt;/code&gt;, not only streamlines CRUD operations but also contributes to the overall maintainability of your codebase. No longer do you find &lt;code&gt;User::create()&lt;/code&gt; directly in your controller 🤢, but rather, the creation logic is encapsulated within the dedicated repository. This separation of concerns not only enhances the clarity of your code but also ensures that each component has a specific and well-defined responsibility.&lt;/p&gt;

&lt;p&gt;Embracing the Repository Design Pattern is not just about organizing code; it's a strategic move towards creating robust and scalable applications. It empowers developers with a systematic approach to handling data access, making your codebase more maintainable, readable, and aligned with best practices in software design.&lt;/p&gt;

</description>
      <category>larevel</category>
      <category>designpatterns</category>
      <category>services</category>
      <category>repositories</category>
    </item>
  </channel>
</rss>
