<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
  <channel>
    <title>Yousef Hamza</title>
    <description>I'm Joe, I work &lt;a href=&quot;https://instabug.com&quot;&gt;at Instabug&lt;/a&gt;.</description>
    <link>http://yourdomain.com/</link>
    <atom:link href="http://yourdomain.com/feed.xml" rel="self" type="application/rss+xml"/>
    <pubDate>Wed, 28 Feb 2024 20:27:03 +0000</pubDate>
    <lastBuildDate>Wed, 28 Feb 2024 20:27:03 +0000</lastBuildDate>
    <generator>Jekyll v3.9.5</generator>
    
      <item>
        <title>The Highest Product Leverage</title>
        <description>&lt;p&gt;&lt;img src=&quot;/assests/product_leverage/steve_jobs.png&quot; alt=&quot;steve jobs&quot; title=&quot;steve jobs&quot; /&gt;
I spend more time than I’m comfortable with on Twitter. but photos like this keep me hooked.&lt;/p&gt;

&lt;p&gt;It is remarkable how Apple went from this hideous device being “This may be our answer” to the actual iPhone they shipped.&lt;/p&gt;

&lt;p&gt;The people at Apple are not just smart, again, they called the device in the screenshot “This may be our answer”.
So it must be their process that allows them to go from this photo to the actual iPhone they shipped&lt;/p&gt;

&lt;p&gt;I remember a talk about Steve Jobs where he talked about how Apple iterates on products and I think that can be the answer here. I’m not sure but I can see it. It’s too abstract&lt;/p&gt;

&lt;h2 id=&quot;feedback-time&quot;&gt;Feedback time&lt;/h2&gt;

&lt;p&gt;A real sense of iterations can be linked to fast feedback times, the faster the creator can see his creation, the more iterations he/she can do before the creation reaches the “good enough” stage.&lt;/p&gt;

&lt;p&gt;Designers can feel this better than programmers, but as a programmer, every time you face a bug during development and every time you test your code, you are iterating on your creation, you are
getting closer to “good enough”.&lt;/p&gt;

&lt;p&gt;I’m a programmer, so I can speak about feedback time better in that context. I was working most of my career as a mobile developer.&lt;/p&gt;

&lt;p&gt;Typical iteration for me would be writing code, and then hitting run, a compiler takes the code I write, compiles it, and runs it on a simulator, I click on the simulator, test my app, then I go back to the code and repeat. Until I reach “good enough”&lt;/p&gt;

&lt;p&gt;Now that used to be the case for most of my career, then declarative UI came along, and &lt;em&gt;live previews&lt;/em&gt; now enable you to change the code and see the results of your code instantly, this almost 10x your iteration speed!&lt;/p&gt;

&lt;p&gt;You can even see the changes you made in the simulator, cutting compiling time to zero.&lt;/p&gt;

&lt;h2 id=&quot;product-leverage&quot;&gt;Product Leverage&lt;/h2&gt;

&lt;p&gt;The shorter feedback cycle doesn’t only mean that you can reach “good enough” faster but do more &lt;em&gt;iterations&lt;/em&gt;, thus achieving a better end result.&lt;/p&gt;

&lt;blockquote&gt;
  &lt;p&gt;Warning: This applies to when you are the actual creator/executor, not just the executor. Or in a culture that promotes iterations.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;The reason I bothered to write this is to actually share this talk below, I do not want to spoil it too much but in this talk, the speaker shows some demos showing how we can get feedback time for creators down to ZERO.&lt;/p&gt;

&lt;p&gt;The talk is 12 years old, but the demos shown are way ahead of our time TODAY, it’s amazing that we do not have these tools yet.&lt;/p&gt;

&lt;p&gt;I hope you enjoy the talk like I did:&lt;/p&gt;

&lt;iframe width=&quot;560&quot; height=&quot;315&quot; src=&quot;https://www.youtube.com/embed/PUv66718DII?si=-wNTxioVeZQBPH-h&quot; title=&quot;YouTube video player&quot; frameborder=&quot;0&quot; allow=&quot;accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share&quot; allowfullscreen=&quot;&quot;&gt;&lt;/iframe&gt;
</description>
        <pubDate>Tue, 27 Feb 2024 18:04:29 +0000</pubDate>
        <link>http://yourdomain.com/jekyll/update/2024/02/27/Power-of-fast-iterations.html</link>
        <guid isPermaLink="true">http://yourdomain.com/jekyll/update/2024/02/27/Power-of-fast-iterations.html</guid>
        
        
        <category>jekyll</category>
        
        <category>update</category>
        
      </item>
    
      <item>
        <title>Full Stack Types</title>
        <description>&lt;p&gt;Types are awesome! Whether you’re navigating a new codebase or revamping older ones, checking local variables’ types can give you a sense of where you are. Not to mention, auto-completion is a nice touch that can help you advance further.&lt;/p&gt;

&lt;p&gt;However, in most programming languages, there are certain boundaries you can’t cross. A typical example is an API endpoint, which may require you to connect with other systems, most likely, your backend (BE) application. At this frontier, you have to disengage from the codebase entirely to check the company’s Slack or, if you’re super efficient, you might have a specialized documentation center to refer to.&lt;/p&gt;

&lt;p&gt;Imagine a world where you don’t have to step out of the codebase - an unbroken chain extending from your React component, through your REST APIs, to your database scheme. Well, guess what? I’ve found a way using Typescript.&lt;/p&gt;

&lt;h1 id=&quot;full-stack-types&quot;&gt;Full Stack Types&lt;/h1&gt;

&lt;p&gt;Let’s begin with an unfinished surveys application which presently has a form to accept questions. We’ll now introduce a description property for these questions.
&lt;img src=&quot;/assests/e2e_form/app.png&quot; alt=&quot;App image&quot; /&gt;&lt;/p&gt;

&lt;p&gt;Encountered an error as soon as you started entering a new question? Yes! That is the magic of Typescript. Using the “zod” scheme, it generates a valid option for survey fields’ names.
&lt;img src=&quot;/assests/e2e_form/form_error.png&quot; alt=&quot;Form Error&quot; title=&quot;Form Error&quot; /&gt;&lt;/p&gt;

&lt;p&gt;Our next step includes updating the zod scheme to accommodate the new field.
&lt;img src=&quot;/assests/e2e_form/scheme_after.png&quot; alt=&quot;Scheme after&quot; /&gt;&lt;/p&gt;

&lt;p&gt;While the front-end (FE) application gives us the green signal, we have an unhappy face at the BE application, specifically at the “Adapter”. The Adapter carries out the job of converting the FE survey type to the DB survey scheme.
&lt;img src=&quot;/assests/e2e_form/adapter_before.png&quot; alt=&quot;Adapter before&quot; title=&quot;Adapter before&quot; /&gt;&lt;/p&gt;

&lt;p&gt;Let’s go ahead and update the BE survey model along with the adapter.
&lt;img src=&quot;/assests/e2e_form/adapter_after.png&quot; alt=&quot;Adapter after&quot; /&gt;&lt;/p&gt;

&lt;p&gt;Oops! Our service seems displeased as our model of DB returns doesn’t match what the DB actually returns! However, Drizzle comes to our rescue, enabling us to cope with it efficiently.
&lt;img src=&quot;/assests/e2e_form/service_error.png&quot; alt=&quot;Service error&quot; /&gt;&lt;/p&gt;

&lt;p&gt;We are now onto the DB scheme. Let’s edit and add our new field. Drama over, no more errors!
&lt;img src=&quot;/assests/e2e_form/db_scheme.png&quot; alt=&quot;DB scheme&quot; /&gt;&lt;/p&gt;

&lt;p&gt;You must be thinking that I forgot about creating a migration for the DB change. Absolutely not! Why bother when Drizzle has our back? With some tweaks on the schemes, Drizzle can generate migration from those changes.&lt;/p&gt;

&lt;p&gt;Let’s make a quick round back to our application, and voila, it’s working perfectly fine.
&lt;img src=&quot;/assests/e2e_form/app_working.gif&quot; alt=&quot;App working&quot; /&gt;&lt;/p&gt;

&lt;h1 id=&quot;how-it-works&quot;&gt;How it works&lt;/h1&gt;

&lt;p&gt;The magic word is “Monorepos”. Furthermore, the shared package plays a decisive role. It connects the FE to the BE through a shared code that’s written only once but used in both parts of the application.&lt;/p&gt;

&lt;h1 id=&quot;challenges-and-potential-solutions&quot;&gt;Challenges and potential solutions&lt;/h1&gt;

&lt;p&gt;Impressed by the process?&lt;/p&gt;

&lt;p&gt;Important disclosure - I’m new to the JS/TS world, hence, I’d welcome any better solutions or recommendations.&lt;/p&gt;

&lt;p&gt;The major challenge I stumbled upon was handling JS modules in Node. I couldn’t get ESM to work with my node.js application, even after attempts with type module settings. I resolved this by using commonJS for my shared package and ESM for my React application.&lt;/p&gt;

&lt;h1 id=&quot;final-word&quot;&gt;Final Word&lt;/h1&gt;

&lt;p&gt;Are you keen on diving deeper? If you’d like to have a template of this project when it’s ready, leave your email &lt;a href=&quot;https://forms.gle/T7zpDNpNS1uw2yK86&quot;&gt;HERE&lt;/a&gt;&lt;/p&gt;
</description>
        <pubDate>Tue, 12 Sep 2023 18:04:29 +0000</pubDate>
        <link>http://yourdomain.com/jekyll/update/2023/09/12/E2E-typing-system.html</link>
        <guid isPermaLink="true">http://yourdomain.com/jekyll/update/2023/09/12/E2E-typing-system.html</guid>
        
        
        <category>jekyll</category>
        
        <category>update</category>
        
      </item>
    
      <item>
        <title>Learning Paralysis</title>
        <description>&lt;p&gt;When I started my career at Instabug 7 years ago, I was not yet sure what career to pursue as a software developer, should I learn Frontend development or Backend development? should I learn Python or Ruby?&lt;/p&gt;

&lt;p&gt;3 months before I have started as full time iOS developer at Instabug, I was a BE intern at another company. At the time, I wouldn’t even think of applying to Instabug as an iOS developer, if it wasn’t for the recruiter that contacted me on LinkedIn (Thanks Donia 🙌).&lt;/p&gt;

&lt;h1 id=&quot;my-life-as-an-ios-developer&quot;&gt;My Life as an iOS Developer&lt;/h1&gt;

&lt;p&gt;When I want to start an iOS app, I open Xcode, I have many templates to choose from, and when I choose one:&lt;/p&gt;

&lt;p&gt;The app is runnable already. There’s unit tests and UI tests setup available. I can release it with a couple of clicks ✅.&lt;/p&gt;

&lt;h1 id=&quot;programming-as-a-hobby&quot;&gt;Programming as a Hobby&lt;/h1&gt;

&lt;p&gt;In the last 6 weeks, I picked up coding as a hobby, I just love it and I miss it so much since I became an Engineering Manager.&lt;/p&gt;

&lt;p&gt;And as a hobby, I tried to build a web application BE and FE. In the first 2 days, I was already overwhelemed with the choices to make:&lt;/p&gt;

&lt;ol&gt;
  &lt;li&gt;Which language to use&lt;/li&gt;
  &lt;li&gt;Which framework to use&lt;/li&gt;
  &lt;li&gt;How should I setup my project?&lt;/li&gt;
  &lt;li&gt;Which build system I should choose?&lt;/li&gt;
  &lt;li&gt;Which package manager to use?&lt;/li&gt;
  &lt;li&gt;Which testing framework to use?&lt;/li&gt;
  &lt;li&gt;I need to read .env file? Install a package for that&lt;/li&gt;
  &lt;li&gt;I need to route to multiple pages in my react app? Which framework to use?&lt;/li&gt;
  &lt;li&gt;I’m done, how to “release”?&lt;/li&gt;
  &lt;li&gt;Just upload it somewhere and run it?&lt;/li&gt;
  &lt;li&gt;How can I make sure only I can upload it?&lt;/li&gt;
  &lt;li&gt;Want to persist data? What DB to use? How to accces it from my application?&lt;/li&gt;
  &lt;li&gt;How to handle DB migrations?&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;And I’m not done yet.&lt;/p&gt;

&lt;hr /&gt;

&lt;h1 id=&quot;learning-paralysis&quot;&gt;Learning Paralysis&lt;/h1&gt;

&lt;p&gt;Looking back to when I was in college, these choices &lt;em&gt;paralyzed&lt;/em&gt; me. I spent a lot of time trying to decide what to learn, instead of learning it.&lt;/p&gt;

&lt;p&gt;The iOS development setup was so simple I spent a lot of time actually doing it, that I have &lt;em&gt;accidently&lt;/em&gt; gained enough experience to land a very sweet job at a company that I considered too prestigious to `even apply.&lt;/p&gt;

&lt;p&gt;If I can speak to my younger self, whenever facing a choice, just pick the most popular solution at the time, and start building.&lt;/p&gt;
</description>
        <pubDate>Tue, 12 Sep 2023 18:04:29 +0000</pubDate>
        <link>http://yourdomain.com/jekyll/update/2023/09/12/Learning-FullStack.html</link>
        <guid isPermaLink="true">http://yourdomain.com/jekyll/update/2023/09/12/Learning-FullStack.html</guid>
        
        
        <category>jekyll</category>
        
        <category>update</category>
        
      </item>
    
  </channel>
</rss>
