<?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: Raji Sarafadeen Sanjo</title>
    <description>The latest articles on DEV Community by Raji Sarafadeen Sanjo (@rajissctrl).</description>
    <link>https://dev.to/rajissctrl</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%2F371691%2Fdfd6bf4d-ec4b-44de-82b3-4bd2c2c6770c.jpg</url>
      <title>DEV Community: Raji Sarafadeen Sanjo</title>
      <link>https://dev.to/rajissctrl</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/rajissctrl"/>
    <language>en</language>
    <item>
      <title>Why I Want to Be a Front-End Developer and How HNG Will Help Me Achieve My Goals</title>
      <dc:creator>Raji Sarafadeen Sanjo</dc:creator>
      <pubDate>Thu, 06 Feb 2025 09:55:57 +0000</pubDate>
      <link>https://dev.to/rajissctrl/why-i-want-to-be-a-front-end-developer-and-how-hng-will-help-me-achieve-my-goals-3j20</link>
      <guid>https://dev.to/rajissctrl/why-i-want-to-be-a-front-end-developer-and-how-hng-will-help-me-achieve-my-goals-3j20</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%2Fdorirat8ksixkj8o7oc8.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%2Fdorirat8ksixkj8o7oc8.jpg" alt="Image description" width="800" height="390"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;My Motivation&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;I've always been fascinated by how websites can tell stories and connect people. As a React.js developer, I get to blend my love for art with coding. The thrill of seeing my designs come to life through code is what drives me.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;How HNG Will Help Me Grow in the Field&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;HNG isn't just an internship; it's a practical journey into the tech world. They simulate real job scenarios with tasks that help you develop both skills and ethics. I'm excited about using React.js in these projects, especially knowing that HNG prepares you for real-world challenges. Check out &lt;a href="https://hng.tech/hire/reactjs-developers" rel="noopener noreferrer"&gt;HIRE REACT.JS DEVELOPERS&lt;/a&gt; if you're looking, for talent like me.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;My Goals for the Internship and How I Plan to Achieve Them&lt;/strong&gt;&lt;br&gt;
Master React.js: I want to go beyond the basics, dive into complex components, optimize performance, and get to know React inside and out. &lt;br&gt;
Create a Portfolio to Be Proud Of: Every project I work on will be a chance to showcase my skills and creativity. I plan to make each one count, turning them into pieces of a portfolio that speaks volumes about my capability and passion.&lt;br&gt;
Grow as a Professional: HNG's environment will teach me the ins and outs of working in a team, managing time, and maintaining ethical standards in coding.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;1. Master React.js:&lt;/strong&gt; I want to push my limits, to learning complex React features.&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Build a Strong Portfolio:&lt;/strong&gt; Each project will be an opportunity to showcase my creativity and skill.
&lt;strong&gt;3. Learn Professionalism:&lt;/strong&gt; HNG will teach me how to work in teams, manage time, and code ethically.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;strong&gt;To make these goals a reality, I'll:&lt;/strong&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;I will throw myself into every project with all my energy, ensuring my work is not just functional, but also innovative.&lt;/li&gt;
&lt;li&gt;I will actively seek out advice and feedback from mentors because I believe in learning from those who've walked the path before me.
I will keep my learning hat on, staying curious and up-to-date with the latest in React.js and web development trends.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;In the end, joining HNG feels like a step towards fulfilling dreams, I've had since I first wrote "Hello World" in my code editor. With HNG's unique approach to learning through doing, I'm confident I'll not only reach my goals but also bring something new and valuable to the world of front-end development.&lt;/p&gt;

</description>
    </item>
    <item>
      <title>A Comparative Analysis of Svelte and ReactJS</title>
      <dc:creator>Raji Sarafadeen Sanjo</dc:creator>
      <pubDate>Fri, 28 Jun 2024 05:44:23 +0000</pubDate>
      <link>https://dev.to/rajissctrl/a-comparative-analysis-of-svelte-and-reactjs-jm3</link>
      <guid>https://dev.to/rajissctrl/a-comparative-analysis-of-svelte-and-reactjs-jm3</guid>
      <description>&lt;p&gt;&lt;strong&gt;Introduction&lt;/strong&gt;:&lt;br&gt;
Frontend development is a rapidly evolving field, with various technologies vying for attention. This article delves into the differences between Svelte and ReactJS, two prominent front-end frameworks.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Svelte&lt;/strong&gt;:&lt;br&gt;
Svelte is a relatively new framework that compiles code at build time, resulting in smaller bundle sizes and faster performance. Its concise syntax makes it easier to write and maintain code.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;ReactJS&lt;/strong&gt;:&lt;br&gt;
ReactJS, a well-established framework, utilizes a virtual DOM for optimized rendering and updates. Its component-based architecture simplifies complex application management. React's vast community and extensive libraries make it a popular choice.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Comparison&lt;/strong&gt;:&lt;br&gt;
Svelte and ReactJS differ in their approaches. Svelte focuses on compilation and performance, while React emphasizes reusability and maintainability. Svelte's smaller bundle sizes suit smaller applications, while React's flexibility is ideal for larger projects.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Conclusion&lt;/strong&gt;:&lt;br&gt;
In conclusion, Svelte and ReactJS are distinct frontend frameworks with unique strengths. Svelte excels in performance, while React shines in maintainability. Understanding their differences enables developers to choose the best framework for their projects.&lt;/p&gt;

</description>
    </item>
    <item>
      <title>JAVASCRIPT EVENT AND THE MAGIC OF IT IN THE WEB BROWSER</title>
      <dc:creator>Raji Sarafadeen Sanjo</dc:creator>
      <pubDate>Sat, 09 Apr 2022 14:49:00 +0000</pubDate>
      <link>https://dev.to/rajissctrl/javascript-event-and-the-magic-of-it-in-the-web-browser-41dn</link>
      <guid>https://dev.to/rajissctrl/javascript-event-and-the-magic-of-it-in-the-web-browser-41dn</guid>
      <description>&lt;p&gt;This article is primarily written with the beginners in javascript in mind.&lt;br&gt;
As a beginner, we often wondered and are curious as to how a button or text will be clicked and something will change in the UI(user interface). It usually confusing at the beginning of our journey and not so simple to grasp the concept of how every event is been linked together to affect the browser UI and the DOM (Document Object Model).&lt;br&gt;
Let's get started with what event is in javascript.&lt;/p&gt;

&lt;p&gt;Client-side JavaScript programs are almost universally event-driven: rather than running some kind of predetermined computation, they typically wait for the user to do something and then respond to the user’s actions. The web browser generates an event when the user presses a key on the keyboard, moves the mouse, clicks a mouse button, or touches a touchscreen device. Event-driven JavaScript programs register callback functions for specified types of events in specified contexts, and the web browser invokes those functions whenever the specified events occur. These callback functions are called event handlers or event listeners, and they are registered with addEventListener():&lt;/p&gt;

&lt;p&gt;we will be demonstrating two of the above-mentioned event, namely, click and keyup.&lt;/p&gt;

&lt;p&gt;HTML&lt;br&gt;
&lt;a href="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fcoh6dcq1loos4bhmvdjy.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fcoh6dcq1loos4bhmvdjy.png" alt="Image description" width="800" height="401"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;CLICK EVENT&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fgr8g04lktmjg0h0c1pt7.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fgr8g04lktmjg0h0c1pt7.png" alt="Image description" width="800" height="350"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;KEYUP&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fpsjaljdoz2c94y1inetx.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fpsjaljdoz2c94y1inetx.png" alt="Image description" width="800" height="422"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;RESULT&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fzgvy6tdey8idpoq7cxjj.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/cdn-cgi/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fzgvy6tdey8idpoq7cxjj.png" alt="Image description" width="628" height="360"&gt;&lt;/a&gt;&lt;/p&gt;

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

</description>
      <category>beginners</category>
    </item>
  </channel>
</rss>
