<?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: Thierry Chau</title>
    <description>The latest articles on DEV Community by Thierry Chau (@thierrychau).</description>
    <link>https://dev.to/thierrychau</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%2F1118618%2F648ab517-dd3f-4ea0-b35a-87308957caa0.jpeg</url>
      <title>DEV Community: Thierry Chau</title>
      <link>https://dev.to/thierrychau</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/thierrychau"/>
    <language>en</language>
    <item>
      <title>How to Use Sqids in Rails to Obfuscate IDs</title>
      <dc:creator>Thierry Chau</dc:creator>
      <pubDate>Sat, 24 Aug 2024 15:17:15 +0000</pubDate>
      <link>https://dev.to/thierrychau/how-to-use-sqids-in-rails-to-obfuscate-ids-30md</link>
      <guid>https://dev.to/thierrychau/how-to-use-sqids-in-rails-to-obfuscate-ids-30md</guid>
      <description>&lt;p&gt;When developing web applications, it’s common to expose database IDs in URLs, such as example.com/posts/123. While this is convenient, it has potential drawbacks. Sequential IDs can reveal information about your database, like the number of records or the order in which they were created. To address this, developers often look for ways to obfuscate these IDs while keeping them reversible for internal use. This is where SQIDs come into play.&lt;/p&gt;

&lt;h1&gt;
  
  
  What is Sqids?
&lt;/h1&gt;

&lt;p&gt;Sqids is a library designed to generate short, non-sequential, and URL-friendly IDs from integers. Unlike UUIDs, which are long and not user-friendly, Sqids provide a compact alternative that can be used in URLs to hide the real database IDs. They’re particularly useful in scenarios where you want to obfuscate your IDs without modifying your database schema or introducing significant overhead.&lt;/p&gt;

&lt;h1&gt;
  
  
  Why Not Use UUID?
&lt;/h1&gt;

&lt;p&gt;UUIDs (Universally Unique Identifiers) are often used as an alternative to numeric IDs for their uniqueness across distributed systems. However, UUIDs have a few drawbacks:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Length: UUIDs are typically 36 characters long, which can make URLs cumbersome.&lt;/li&gt;
&lt;li&gt;Not Sequential: While they are unique, UUIDs are not sequential, making indexing in databases less efficient.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;On the other hand, Sqids offer a balance between security, URL friendliness, and reversibility, making them an ideal choice for many applications.&lt;/p&gt;

&lt;h1&gt;
  
  
  Implementing Sqids in Rails
&lt;/h1&gt;

&lt;p&gt;Here’s how you can implement Sqids in a Rails application using a concern. This approach ensures that you don’t have to modify your database schema, and you can easily integrate it with your existing models.&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 1: Install the Sqids Gem
&lt;/h2&gt;

&lt;p&gt;First, add the Sqids Ruby gem to your Gemfile:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight ruby"&gt;&lt;code&gt;&lt;span class="n"&gt;gem&lt;/span&gt; &lt;span class="s1"&gt;'sqids'&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Run &lt;code&gt;bundle install&lt;/code&gt; to install the gem.&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 2: Create a Concern for Sqids
&lt;/h2&gt;

&lt;p&gt;Next, create a concern to encapsulate the logic for encoding and decoding Sqids:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight ruby"&gt;&lt;code&gt;&lt;span class="c1"&gt;# app/models/concerns/sqids_encodable.rb&lt;/span&gt;

&lt;span class="k"&gt;module&lt;/span&gt; &lt;span class="nn"&gt;SqidsEncodable&lt;/span&gt;
  &lt;span class="kp"&gt;extend&lt;/span&gt; &lt;span class="no"&gt;ActiveSupport&lt;/span&gt;&lt;span class="o"&gt;::&lt;/span&gt;&lt;span class="no"&gt;Concern&lt;/span&gt;

  &lt;span class="c1"&gt;# arguments here are optional ; you can change the alphabet to change the encoding sequence&lt;/span&gt;
  &lt;span class="no"&gt;SQIDS&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="no"&gt;Sqids&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;new&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="ss"&gt;alphabet: &lt;/span&gt;&lt;span class="s1"&gt;'k3G7QAe51FCsPW92uEOyq4Bg6Sp8YzVTmnU0liwDdHXLajZrfxNhobJIRcMvKt'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="ss"&gt;min_length: &lt;/span&gt;&lt;span class="mi"&gt;8&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;

  &lt;span class="k"&gt;def&lt;/span&gt; &lt;span class="nf"&gt;to_param&lt;/span&gt;
    &lt;span class="n"&gt;sqid&lt;/span&gt;
  &lt;span class="k"&gt;end&lt;/span&gt;

  &lt;span class="k"&gt;def&lt;/span&gt; &lt;span class="nf"&gt;sqid&lt;/span&gt;
    &lt;span class="no"&gt;SQIDS&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;encode&lt;/span&gt;&lt;span class="p"&gt;([&lt;/span&gt;&lt;span class="nb"&gt;id&lt;/span&gt;&lt;span class="p"&gt;])&lt;/span&gt;
  &lt;span class="k"&gt;end&lt;/span&gt;

  &lt;span class="n"&gt;class_methods&lt;/span&gt; &lt;span class="k"&gt;do&lt;/span&gt;
    &lt;span class="k"&gt;def&lt;/span&gt; &lt;span class="nf"&gt;find_by_sqid&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;sqid&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
      &lt;span class="n"&gt;find&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="no"&gt;SQIDS&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;decode&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;sqid&lt;/span&gt;&lt;span class="p"&gt;).&lt;/span&gt;&lt;span class="nf"&gt;first&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
    &lt;span class="k"&gt;end&lt;/span&gt;
  &lt;span class="k"&gt;end&lt;/span&gt;
&lt;span class="k"&gt;end&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This concern does a few key things:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;to_param&lt;/code&gt; method: Overrides the default to_param method to return the SQID instead of the numeric ID. This ensures that Rails uses the SQID in URLs.&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;sqid&lt;/code&gt; method: Encodes the model’s ID using Sqids.&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;find_by_sqid&lt;/code&gt; method: Allows you to find a record by its SQID, decoding it back to the original ID.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Step 3: Use the Concern in Your Models
&lt;/h2&gt;

&lt;p&gt;To use this in a model, include the SqidsEncodable concern:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight ruby"&gt;&lt;code&gt;&lt;span class="c1"&gt;# app/models/post.rb&lt;/span&gt;

&lt;span class="k"&gt;class&lt;/span&gt; &lt;span class="nc"&gt;Post&lt;/span&gt; &lt;span class="o"&gt;&amp;lt;&lt;/span&gt; &lt;span class="no"&gt;ApplicationRecord&lt;/span&gt;
  &lt;span class="kp"&gt;include&lt;/span&gt; &lt;span class="no"&gt;SqidsEncodable&lt;/span&gt;

  &lt;span class="c1"&gt;# Your model logic here&lt;/span&gt;
&lt;span class="k"&gt;end&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;With this setup, whenever you generate a URL for a Post, Rails will automatically use the SQID instead of the numeric ID.&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 4: Use Sqids in Your Controllers
&lt;/h2&gt;

&lt;p&gt;When querying for a record, use find_by_sqid:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight ruby"&gt;&lt;code&gt;&lt;span class="c1"&gt;# app/controllers/posts_controller.rb&lt;/span&gt;

&lt;span class="k"&gt;class&lt;/span&gt; &lt;span class="nc"&gt;PostsController&lt;/span&gt; &lt;span class="o"&gt;&amp;lt;&lt;/span&gt; &lt;span class="no"&gt;ApplicationController&lt;/span&gt;
  &lt;span class="k"&gt;def&lt;/span&gt; &lt;span class="nf"&gt;set_post&lt;/span&gt;
    &lt;span class="vi"&gt;@post&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="no"&gt;Post&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;find_by_sqid&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;params&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="ss"&gt;:id&lt;/span&gt;&lt;span class="p"&gt;])&lt;/span&gt;
  &lt;span class="k"&gt;end&lt;/span&gt;

  &lt;span class="c1"&gt;# Other controller actions&lt;/span&gt;
&lt;span class="k"&gt;end&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This ensures that Rails can correctly retrieve the record using the obfuscated ID.&lt;/p&gt;

&lt;h1&gt;
  
  
  Conclusion
&lt;/h1&gt;

&lt;p&gt;We went from &lt;code&gt;example.com/posts/123&lt;/code&gt; to something like &lt;code&gt;example.com/posts/5sQ1BZoD&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;Sqids offer a practical solution for obfuscating database IDs in a Rails application. They allow you to hide the actual IDs from users, while still being able to reverse the process internally. Compared to UUIDs, SQIDs provide a more user-friendly, compact, and efficient approach.&lt;/p&gt;

&lt;p&gt;It’s important to note that while Sqids obfuscate the IDs, they do not encrypt them. If you require encryption for your IDs, you’ll need to look into more robust security measures. However, for most applications, SQIDs strike a good balance between security and usability.&lt;/p&gt;

&lt;p&gt;Learn more about &lt;a href="https://cheatsheetseries.owasp.org/cheatsheets/Insecure_Direct_Object_Reference_Prevention_Cheat_Sheet.html" rel="noopener noreferrer"&gt;Insecure Direct Object Reference&lt;/a&gt;&lt;br&gt;
Learn more about &lt;a href="https://sqids.org/" rel="noopener noreferrer"&gt;Sqids&lt;/a&gt; | &lt;a href="https://github.com/sqids/sqids-ruby" rel="noopener noreferrer"&gt;GitHub repository&lt;/a&gt;&lt;/p&gt;

</description>
      <category>rails</category>
      <category>ruby</category>
      <category>sqids</category>
      <category>hashid</category>
    </item>
    <item>
      <title>Understanding Fall-Through in Java Switch-Case Statements</title>
      <dc:creator>Thierry Chau</dc:creator>
      <pubDate>Wed, 17 Jul 2024 15:26:05 +0000</pubDate>
      <link>https://dev.to/thierrychau/understanding-fall-through-in-java-switch-case-statements-17gb</link>
      <guid>https://dev.to/thierrychau/understanding-fall-through-in-java-switch-case-statements-17gb</guid>
      <description>&lt;p&gt;In Java programming, the switch-case statement is a control structure used to execute one block of code among many based on the value of a variable. It can be more efficient and readable than using multiple if-else statements. One important concept to understand when working with switch-case statements is "fall-through."&lt;/p&gt;

&lt;h2&gt;
  
  
  What is Fall-Through?
&lt;/h2&gt;

&lt;p&gt;Fall-through occurs when the code execution continues from one case to the next without encountering a break statement. By default, after a matching case block is executed, the control flow will fall through to the subsequent case blocks until a break statement is encountered or the switch statement ends.&lt;/p&gt;

&lt;h2&gt;
  
  
  Syntax of a Switch-Case Statement
&lt;/h2&gt;

&lt;p&gt;Here is the basic syntax of a switch-case statement in Java:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight java"&gt;&lt;code&gt;&lt;span class="k"&gt;switch&lt;/span&gt; &lt;span class="o"&gt;(&lt;/span&gt;&lt;span class="n"&gt;expression&lt;/span&gt;&lt;span class="o"&gt;)&lt;/span&gt; &lt;span class="o"&gt;{&lt;/span&gt;
    &lt;span class="k"&gt;case&lt;/span&gt; &lt;span class="nl"&gt;value1:&lt;/span&gt;
        &lt;span class="c1"&gt;// code block&lt;/span&gt;
        &lt;span class="k"&gt;break&lt;/span&gt;&lt;span class="o"&gt;;&lt;/span&gt;
    &lt;span class="k"&gt;case&lt;/span&gt; &lt;span class="nl"&gt;value2:&lt;/span&gt;
        &lt;span class="c1"&gt;// code block&lt;/span&gt;
        &lt;span class="k"&gt;break&lt;/span&gt;&lt;span class="o"&gt;;&lt;/span&gt;
    &lt;span class="k"&gt;default&lt;/span&gt;&lt;span class="o"&gt;:&lt;/span&gt;
        &lt;span class="c1"&gt;// default code block&lt;/span&gt;
&lt;span class="o"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Example of Fall-Through
&lt;/h2&gt;

&lt;p&gt;Let's look at an example to understand how fall-through works:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight java"&gt;&lt;code&gt;&lt;span class="kt"&gt;int&lt;/span&gt; &lt;span class="n"&gt;day&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="o"&gt;;&lt;/span&gt;
&lt;span class="k"&gt;switch&lt;/span&gt; &lt;span class="o"&gt;(&lt;/span&gt;&lt;span class="n"&gt;day&lt;/span&gt;&lt;span class="o"&gt;)&lt;/span&gt; &lt;span class="o"&gt;{&lt;/span&gt;
    &lt;span class="k"&gt;case&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="o"&gt;:&lt;/span&gt;
        &lt;span class="nc"&gt;System&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;out&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;println&lt;/span&gt;&lt;span class="o"&gt;(&lt;/span&gt;&lt;span class="s"&gt;"Monday"&lt;/span&gt;&lt;span class="o"&gt;);&lt;/span&gt;
    &lt;span class="k"&gt;case&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="o"&gt;:&lt;/span&gt;
        &lt;span class="nc"&gt;System&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;out&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;println&lt;/span&gt;&lt;span class="o"&gt;(&lt;/span&gt;&lt;span class="s"&gt;"Tuesday"&lt;/span&gt;&lt;span class="o"&gt;);&lt;/span&gt;
    &lt;span class="k"&gt;case&lt;/span&gt; &lt;span class="mi"&gt;3&lt;/span&gt;&lt;span class="o"&gt;:&lt;/span&gt;
        &lt;span class="nc"&gt;System&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;out&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;println&lt;/span&gt;&lt;span class="o"&gt;(&lt;/span&gt;&lt;span class="s"&gt;"Wednesday"&lt;/span&gt;&lt;span class="o"&gt;);&lt;/span&gt;
    &lt;span class="k"&gt;default&lt;/span&gt;&lt;span class="o"&gt;:&lt;/span&gt;
        &lt;span class="nc"&gt;System&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;out&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;println&lt;/span&gt;&lt;span class="o"&gt;(&lt;/span&gt;&lt;span class="s"&gt;"Other day"&lt;/span&gt;&lt;span class="o"&gt;);&lt;/span&gt;
&lt;span class="o"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;In this example, the output will be:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight mathematica"&gt;&lt;code&gt;&lt;span class="nb"&gt;Tuesday&lt;/span&gt;&lt;span class="w"&gt;
&lt;/span&gt;&lt;span class="nb"&gt;Wednesday&lt;/span&gt;&lt;span class="w"&gt;
&lt;/span&gt;&lt;span class="nv"&gt;Other&lt;/span&gt;&lt;span class="w"&gt; &lt;/span&gt;&lt;span class="nv"&gt;day&lt;/span&gt;&lt;span class="w"&gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Explanation
&lt;/h3&gt;

&lt;p&gt;When day is equal to 2, the case 2 block is executed, printing "Tuesday." Since there is no break statement after case 2, the execution continues to case 3 and then to the default case, printing "Wednesday" and "Other day" respectively. This is a classic example of fall-through behavior.&lt;/p&gt;

&lt;h2&gt;
  
  
  Preventing Fall-Through
&lt;/h2&gt;

&lt;p&gt;To prevent fall-through, you should end each case with a break statement:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight java"&gt;&lt;code&gt;&lt;span class="kt"&gt;int&lt;/span&gt; &lt;span class="n"&gt;day&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="o"&gt;;&lt;/span&gt;
&lt;span class="k"&gt;switch&lt;/span&gt; &lt;span class="o"&gt;(&lt;/span&gt;&lt;span class="n"&gt;day&lt;/span&gt;&lt;span class="o"&gt;)&lt;/span&gt; &lt;span class="o"&gt;{&lt;/span&gt;
    &lt;span class="k"&gt;case&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="o"&gt;:&lt;/span&gt;
        &lt;span class="nc"&gt;System&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;out&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;println&lt;/span&gt;&lt;span class="o"&gt;(&lt;/span&gt;&lt;span class="s"&gt;"Monday"&lt;/span&gt;&lt;span class="o"&gt;);&lt;/span&gt;
        &lt;span class="k"&gt;break&lt;/span&gt;&lt;span class="o"&gt;;&lt;/span&gt;
    &lt;span class="k"&gt;case&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="o"&gt;:&lt;/span&gt;
        &lt;span class="nc"&gt;System&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;out&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;println&lt;/span&gt;&lt;span class="o"&gt;(&lt;/span&gt;&lt;span class="s"&gt;"Tuesday"&lt;/span&gt;&lt;span class="o"&gt;);&lt;/span&gt;
        &lt;span class="k"&gt;break&lt;/span&gt;&lt;span class="o"&gt;;&lt;/span&gt;
    &lt;span class="k"&gt;case&lt;/span&gt; &lt;span class="mi"&gt;3&lt;/span&gt;&lt;span class="o"&gt;:&lt;/span&gt;
        &lt;span class="nc"&gt;System&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;out&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;println&lt;/span&gt;&lt;span class="o"&gt;(&lt;/span&gt;&lt;span class="s"&gt;"Wednesday"&lt;/span&gt;&lt;span class="o"&gt;);&lt;/span&gt;
        &lt;span class="k"&gt;break&lt;/span&gt;&lt;span class="o"&gt;;&lt;/span&gt;
    &lt;span class="k"&gt;default&lt;/span&gt;&lt;span class="o"&gt;:&lt;/span&gt;
        &lt;span class="nc"&gt;System&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;out&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;println&lt;/span&gt;&lt;span class="o"&gt;(&lt;/span&gt;&lt;span class="s"&gt;"Other day"&lt;/span&gt;&lt;span class="o"&gt;);&lt;/span&gt;
        &lt;span class="k"&gt;break&lt;/span&gt;&lt;span class="o"&gt;;&lt;/span&gt;
&lt;span class="o"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Now, the output will be:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight mathematica"&gt;&lt;code&gt;&lt;span class="nb"&gt;Tuesday&lt;/span&gt;&lt;span class="w"&gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Intentional Fall-Through
&lt;/h2&gt;

&lt;p&gt;Sometimes, fall-through can be used intentionally to execute multiple cases with the same block of code:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight java"&gt;&lt;code&gt;&lt;span class="kt"&gt;int&lt;/span&gt; &lt;span class="n"&gt;day&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="o"&gt;;&lt;/span&gt;
&lt;span class="k"&gt;switch&lt;/span&gt; &lt;span class="o"&gt;(&lt;/span&gt;&lt;span class="n"&gt;day&lt;/span&gt;&lt;span class="o"&gt;)&lt;/span&gt; &lt;span class="o"&gt;{&lt;/span&gt;
    &lt;span class="k"&gt;case&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="o"&gt;:&lt;/span&gt;
    &lt;span class="k"&gt;case&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="o"&gt;:&lt;/span&gt;
    &lt;span class="k"&gt;case&lt;/span&gt; &lt;span class="mi"&gt;3&lt;/span&gt;&lt;span class="o"&gt;:&lt;/span&gt;
    &lt;span class="k"&gt;case&lt;/span&gt; &lt;span class="mi"&gt;4&lt;/span&gt;&lt;span class="o"&gt;:&lt;/span&gt;
    &lt;span class="k"&gt;case&lt;/span&gt; &lt;span class="mi"&gt;5&lt;/span&gt;&lt;span class="o"&gt;:&lt;/span&gt;
        &lt;span class="nc"&gt;System&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;out&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;println&lt;/span&gt;&lt;span class="o"&gt;(&lt;/span&gt;&lt;span class="s"&gt;"It's a weekday"&lt;/span&gt;&lt;span class="o"&gt;);&lt;/span&gt;
        &lt;span class="k"&gt;break&lt;/span&gt;&lt;span class="o"&gt;;&lt;/span&gt;
    &lt;span class="k"&gt;case&lt;/span&gt; &lt;span class="mi"&gt;6&lt;/span&gt;&lt;span class="o"&gt;:&lt;/span&gt;
    &lt;span class="k"&gt;case&lt;/span&gt; &lt;span class="mi"&gt;7&lt;/span&gt;&lt;span class="o"&gt;:&lt;/span&gt;
        &lt;span class="nc"&gt;System&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;out&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;println&lt;/span&gt;&lt;span class="o"&gt;(&lt;/span&gt;&lt;span class="s"&gt;"It's a weekend"&lt;/span&gt;&lt;span class="o"&gt;);&lt;/span&gt;
        &lt;span class="k"&gt;break&lt;/span&gt;&lt;span class="o"&gt;;&lt;/span&gt;
    &lt;span class="k"&gt;default&lt;/span&gt;&lt;span class="o"&gt;:&lt;/span&gt;
        &lt;span class="nc"&gt;System&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;out&lt;/span&gt;&lt;span class="o"&gt;.&lt;/span&gt;&lt;span class="na"&gt;println&lt;/span&gt;&lt;span class="o"&gt;(&lt;/span&gt;&lt;span class="s"&gt;"Invalid day"&lt;/span&gt;&lt;span class="o"&gt;);&lt;/span&gt;
&lt;span class="o"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;In this example, day values 1 through 5 will all result in "It's a weekday" being printed.&lt;/p&gt;

&lt;h2&gt;
  
  
  Conclusion
&lt;/h2&gt;

&lt;p&gt;Understanding fall-through in switch-case statements is crucial for writing clear and bug-free Java code. While fall-through can be useful in certain scenarios, it is generally a good practice to use break statements to prevent unintended behavior.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Note&lt;/strong&gt;: Unlike Java, the case-when construct in Ruby &lt;u&gt;does not&lt;/u&gt; exhibit fall-through behavior. Each when clause is independent, and execution does not automatically continue to subsequent when clauses without explicit instructions.&lt;/p&gt;

</description>
      <category>java</category>
    </item>
    <item>
      <title>Learning to learn</title>
      <dc:creator>Thierry Chau</dc:creator>
      <pubDate>Thu, 05 Oct 2023 05:15:14 +0000</pubDate>
      <link>https://dev.to/thierrychau/learning-to-learn-3o3l</link>
      <guid>https://dev.to/thierrychau/learning-to-learn-3o3l</guid>
      <description>&lt;p&gt;It's been a bit over a week since I've started the Software Development Foundation training with Discovery Partners Institute in Chicago. And I've learned a lot.&lt;/p&gt;

&lt;p&gt;One main thought that keeps coming to my mind is the way we learn. The course has been very well thought, every new capabilities is built on what has been previously learned. &lt;/p&gt;

&lt;p&gt;If I were to do this all by myself, I'd usually look up the industry standard, and aim for the mountain top. In our case here, it'd probably be Ruby on Rails for making web apps. &lt;/p&gt;

&lt;p&gt;In doing so, I'd be cutting off the (seemingly) unnecessary steps. But it would make the whole process to be much more difficult. Let's go through a few of these steps that allowed me to climb a bit higher every day.&lt;/p&gt;

&lt;h2&gt;
  
  
  From Sinatra to Rails
&lt;/h2&gt;

&lt;p&gt;I remember when we were introduced to Sinatra. We learned about HTTP requests at the same time. I had a general good sense of how the way internet worked, but doing it myself was a revelation ; it felt like new doors of possibilities opened up to me.&lt;/p&gt;

&lt;p&gt;And yet, the first day of our in person class we replaced Sinatra with Rails. Now I understand that Sinatra can have its use case, for smaller apps, or apps where we don't need such a strict layout of files. &lt;/p&gt;

&lt;p&gt;But moving forward, Rails will probably be the go to framework for web app development. But it wasn't lost. If I were to be digging in Rails while learning about HTTP and routing at the same time, it would have been exponentially more difficult. So I am grateful that people have thought through it, and trail blazed the way for us.&lt;/p&gt;

&lt;h2&gt;
  
  
  From SQL commands to Active Records
&lt;/h2&gt;

&lt;p&gt;This process of building upon what was just taught just keeps going on and on with every new day that goes by. The next one is database interactions.&lt;/p&gt;

&lt;p&gt;While being introduced to Rails, we learned about basic SQL commands. I've try to polish my understanding and get some muscle memory in by practicing on &lt;a href="https://sqlzoo.net/"&gt;SQLZoo&lt;/a&gt; and the Firstdraft in-house exercises.&lt;/p&gt;

&lt;p&gt;Quickly after that though, we were introduced to Active Records, which is built in Rails and facilitates interactions with databases.&lt;/p&gt;

&lt;p&gt;Having gone through the process of working directly with databases through SQL, it made me more comfortable with working with Active Records because I have some sense of what is happening in the back-end. &lt;/p&gt;

&lt;h2&gt;
  
  
  Relationship databases: one-to-many, many-to-many
&lt;/h2&gt;

&lt;p&gt;Speaking of database, I've worked with large data in my previous jobs, mostly with Excel. I would sit there behind the computer, and think of the best way to organize it. For the most part, I would come up with something fairly good and usable. But there were some cases I found hard to manage, and I never quite knew why they were different until now.&lt;/p&gt;

&lt;p&gt;Putting words on the concepts of a one-to-many and a many-to-many relationships was truly eye-opening. For the latter, I discovered a third, "hidden" table (the join table). I also understood why some data type were giving me trouble to organize: they were describing a many-to-many relationship, and I was constraining myself with two tables, not knowing the existence of the join table.&lt;/p&gt;

&lt;h2&gt;
  
  
  Refactoring
&lt;/h2&gt;

&lt;p&gt;When learning how to code, it is hard to find the right balance between laying solid foundations, and aiming for clean, industry standard code.&lt;/p&gt;

&lt;p&gt;In this course, we learned to write code mostly from scratch. When we needed to find the director for a movie, we'd use a &lt;code&gt;.where()&lt;/code&gt; method to match the id from the Director table. It's can be long and repetitive.&lt;/p&gt;

&lt;p&gt;And then after typing these for the n-th time, we learned to set up our own class methods to do this more easily. I do know now though, looking back, that this was the right way. If I was taken straight to this point without the grinding, it would probably take me more time down the road to fully understand what is going on.&lt;/p&gt;

&lt;h2&gt;
  
  
  Association Accessors
&lt;/h2&gt;

&lt;p&gt;Take the previous point, and throw in Rails built in Association Accessors method like &lt;code&gt;belongs_to&lt;/code&gt; or &lt;code&gt;has_many&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;Even though I had written these class methods before, when I first was reading about the Association Accessors it felt like climbing up a very steep hill. &lt;/p&gt;

&lt;p&gt;But then because we had spent time writing these, and the exercise was narrowed to a quick refactoring, it made it so much easier to understand.&lt;/p&gt;

&lt;h2&gt;
  
  
  Learning to learn
&lt;/h2&gt;

&lt;p&gt;Learning can be a painful process at times. Good mentorship is key, and concepts broken down in strategic bits is really impactful in how we learn.&lt;/p&gt;

&lt;p&gt;With these conditions, learning feels like a game. Every day, I unlock new capabilities, and I just want to keep playing and keep unlocking the next thing.&lt;/p&gt;

</description>
      <category>ruby</category>
      <category>webdev</category>
      <category>programming</category>
      <category>beginners</category>
    </item>
    <item>
      <title>TIL: Best Practices for Handling Secret Keys in Sinatra - The Do's and Don'ts</title>
      <dc:creator>Thierry Chau</dc:creator>
      <pubDate>Fri, 28 Jul 2023 16:19:27 +0000</pubDate>
      <link>https://dev.to/thierrychau/til-best-practices-for-handling-secret-keys-in-sinatra-the-dos-and-donts-40n4</link>
      <guid>https://dev.to/thierrychau/til-best-practices-for-handling-secret-keys-in-sinatra-the-dos-and-donts-40n4</guid>
      <description>&lt;h2&gt;
  
  
  Introduction
&lt;/h2&gt;

&lt;p&gt;As developers, we often find ourselves dealing with sensitive information like API keys. Sinatra, a lightweight Ruby web framework, offers an excellent platform for creating robust applications. However, when it comes to managing secret keys, it's essential to follow best practices to ensure the security and integrity of our applications.&lt;/p&gt;

&lt;p&gt;In this TIL post, we will explore the insights I gained about secret keys in Sinatra. We'll delve into the dos and don'ts of handling sensitive information, the importance of using environment variables, and the risks associated with exposing secret keys.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--ZsK3O02s--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/oz500comvk5jo3k9aoit.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--ZsK3O02s--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/oz500comvk5jo3k9aoit.png" alt="A big fortress to illustrate impenetrable security" width="512" height="512"&gt;&lt;/a&gt; &lt;br&gt;
&lt;em&gt;I asked dezgo to generate an illustration for this blog post.&lt;/em&gt;&lt;/p&gt;
&lt;h2&gt;
  
  
  1. 1. What is an API?
&lt;/h2&gt;

&lt;p&gt;From Wikipedia:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;An API (Application Programming Interface) is a way for two or more computer programs to communicate with each other. It is a type of software interface, offering a service to other pieces of software.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;For example, Google Maps has an API which allows us developers retrieve information they have gathered about the location of our choice. A URL request looks like this:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight ruby"&gt;&lt;code&gt;&lt;span class="n"&gt;maps_url&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="s2"&gt;"https://maps.googleapis.com/maps/api/geocode/json?address=INPUT_LOCATION&amp;amp;key=#YOUR_API_KEY"&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Pirate Weather is another API. Together with Google Maps, we were able to develop an application which asks the user for a location, and provides coordinates, temperature, and a suggestion of whether or not to bring an umbrella!&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;umbrella main % ruby umbrella.rb 
Will you need an umbrella today?
Enter your location:
Chicago, IL
Checking the weather at Chicago, IL...
"Your coordinates are 41.8781136, -87.6297982."
It is currently 73°F (23°C)
Clear for the next hour.
Hours from now vs Precipitation probability


65|                                  * 
60|                               *  * 
55|                               *  * 
50|                               *  * 
45|                            *  *  * 
40|                            *  *  * 
35|                            *  *  * 
30|                         *  *  *  * 
25|                         *  *  *  * 
20|                      *  *  *  *  * 
15|                   *  *  *  *  *  * 
10|                *  *  *  *  *  *  * 
 5|                *  *  *  *  *  *  * 
 0+------------------------------------
    1  2  3  4  5  6  7  8  9 10 11 12 

You might want to take an umbrella!
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;One of the most famous API currently is probably Open AI, which allows developers to use and tweak the power of Chat GPT for custom applications. One example of this is an AI powered TA that is customized to provide software development specific answers (and more specifically in Ruby).&lt;/p&gt;

&lt;h2&gt;
  
  
  1. 2. What are these API Keys?
&lt;/h2&gt;

&lt;p&gt;APIs are used to enable controlled access to a service or application's functionality and data. To regulate access and ensure security, APIs often require authentication or authorization. This is where API keys come into play.&lt;/p&gt;

&lt;p&gt;An API key is a unique identifier issued to developers or applications that want to access an API. It acts as a secret token that grants permission to interact with the API and access its features or data. The API key is typically included in the request headers or parameters when making API calls.&lt;/p&gt;

&lt;p&gt;More importantly, these API services are usually not provided for free. API keys is a way to track usage, and bill accordingly. For this reason, developers need to carefully handle their API keys and not let other people have access to it.&lt;/p&gt;

&lt;h2&gt;
  
  
  2. Understanding Secret Keys and Environment Variables
&lt;/h2&gt;

&lt;p&gt;Environment variables allow us to do just that. These variables are read using the &lt;code&gt;ENV.fetch()&lt;/code&gt; method, which retrieves the value of the environment variable based on its name.&lt;/p&gt;

&lt;p&gt;The beauty of using environment variables is that they remain stored on the server where the application runs, making them inaccessible to users visiting the website. As long as we do not display, send, or log these variables inappropriately, they stay securely hidden from prying eyes.&lt;/p&gt;

&lt;h2&gt;
  
  
  3. 1. Caution with Development Gems
&lt;/h2&gt;

&lt;p&gt;Even when correctly stored as environment variables, secret keys can be exposed with the use of development gems, such as better_errors (which provide enhanced error pages during development). While these gems are beneficial during development, they should not be used in production environments due to their potential to expose sensitive information during errors.&lt;/p&gt;

&lt;h2&gt;
  
  
  3. 2. Gemfile good practices
&lt;/h2&gt;

&lt;p&gt;One way to avoid this is by separating gems by environment with the group :environment syntax. This is important as it ensures that certain gems are only loaded in the appropriate environments. A Gemfile could look like this:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight ruby"&gt;&lt;code&gt;&lt;span class="n"&gt;gem&lt;/span&gt; &lt;span class="s2"&gt;"sinatra"&lt;/span&gt;
&lt;span class="n"&gt;gem&lt;/span&gt; &lt;span class="s2"&gt;"sinatra-contrib"&lt;/span&gt;
&lt;span class="n"&gt;gem&lt;/span&gt; &lt;span class="s2"&gt;"http"&lt;/span&gt;

&lt;span class="n"&gt;group&lt;/span&gt; &lt;span class="ss"&gt;:development&lt;/span&gt; &lt;span class="k"&gt;do&lt;/span&gt;
  &lt;span class="c1"&gt;#gem "better_errors"&lt;/span&gt;
  &lt;span class="n"&gt;gem&lt;/span&gt; &lt;span class="s2"&gt;"binding_of_caller"&lt;/span&gt;
&lt;span class="k"&gt;end&lt;/span&gt;

&lt;span class="n"&gt;group&lt;/span&gt; &lt;span class="ss"&gt;:development&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="ss"&gt;:test&lt;/span&gt; &lt;span class="k"&gt;do&lt;/span&gt;
  &lt;span class="n"&gt;gem&lt;/span&gt; &lt;span class="s2"&gt;"pry"&lt;/span&gt;
&lt;span class="k"&gt;end&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;When deploying to production, it’s crucial to set the RACK_ENV or RAILS_ENV environment variable to production. This will ensure that only the necessary gems for that environment are loaded.&lt;/p&gt;

&lt;p&gt;As a rule of thumb, any gem that provides debugging or testing capabilities should not be used in your production environment.&lt;/p&gt;

&lt;p&gt;We can set this &lt;code&gt;RACK_ENV&lt;/code&gt; directly in the command line when starting your server. For example:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight console"&gt;&lt;code&gt;&lt;span class="go"&gt;RACK_ENV=production ruby app.rb
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Conclusion
&lt;/h2&gt;

&lt;p&gt;By using environment variables to store sensitive information, we ensure that these keys remain inaccessible to users visiting our websites.&lt;/p&gt;

&lt;p&gt;Development gems used in production environments can result the accidental exposure of sensitive information. A properly set Gemfile can help avoid that.&lt;/p&gt;

&lt;p&gt;By following these best practices, we can build secure and reliable Sinatra applications, protecting our users' data and maintaining the integrity of our code. Happy coding!&lt;/p&gt;

</description>
      <category>ruby</category>
      <category>security</category>
      <category>bestpractice</category>
      <category>todayilearned</category>
    </item>
    <item>
      <title>TIL the basics of Ruby</title>
      <dc:creator>Thierry Chau</dc:creator>
      <pubDate>Fri, 21 Jul 2023 20:37:18 +0000</pubDate>
      <link>https://dev.to/thierrychau/til-the-basics-of-ruby-264g</link>
      <guid>https://dev.to/thierrychau/til-the-basics-of-ruby-264g</guid>
      <description>&lt;p&gt;I dived right into learning Ruby these past few days, and it's been pretty exciting! I've learned a lot and here are a few bullet points to organize my thoughts about this journey&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;You can create your own classes in Ruby, and methods associated with it. There are instance methods and class-level methods. This is how it is done:
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight ruby"&gt;&lt;code&gt;&lt;span class="k"&gt;class&lt;/span&gt; &lt;span class="nc"&gt;New_class&lt;/span&gt;
  &lt;span class="nb"&gt;attr_accessor&lt;/span&gt; &lt;span class="ss"&gt;:attribute&lt;/span&gt;

  &lt;span class="k"&gt;def&lt;/span&gt; &lt;span class="nf"&gt;method_class&lt;/span&gt;
    &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="c1"&gt;#some method&lt;/span&gt;
  &lt;span class="k"&gt;end&lt;/span&gt;

&lt;span class="k"&gt;end&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;code&gt;:attribute&lt;/code&gt; is a Symbol. They act like Strings but are unique, great for using as a key in Hash.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Ruby has a class &lt;code&gt;Date&lt;/code&gt; that needs to be loaded. It allows manipulations on dates
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight ruby"&gt;&lt;code&gt;&lt;span class="nb"&gt;require&lt;/span&gt; &lt;span class="no"&gt;Date&lt;/span&gt;

&lt;span class="n"&gt;pp&lt;/span&gt; &lt;span class="no"&gt;Date&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;today&lt;/span&gt;
&lt;span class="n"&gt;pp&lt;/span&gt; &lt;span class="no"&gt;Date&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;parse&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s2"&gt;"3rd Feb 2001"&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Substracting two dates gives a Rational! It helps with getting accurate results as opposed to ‘Float’ and ‘Decimal’ objects which  can produce inaccurate results because computers have limited memory. For this reason financial payment services always use Integers in their calculations.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Ruby has a large community with many programs available, called "gems". They can be loaded more easily with a "Gemfile" (no extension) with the following code:
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight ruby"&gt;&lt;code&gt;&lt;span class="n"&gt;source&lt;/span&gt; &lt;span class="s2"&gt;"https://rubygems.org"&lt;/span&gt;
&lt;span class="c1"&gt;# the following are examples of gem available&lt;/span&gt;
&lt;span class="n"&gt;gem&lt;/span&gt; &lt;span class="s2"&gt;"activesupport"&lt;/span&gt;
&lt;span class="n"&gt;gem&lt;/span&gt; &lt;span class="s2"&gt;"awesome_print"&lt;/span&gt;
&lt;span class="n"&gt;gem&lt;/span&gt; &lt;span class="s2"&gt;"pry-byebug"&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;These are then installed all at once by typing &lt;code&gt;bundle install&lt;/code&gt; in the terminal.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Github is an amazing ressource for programming. I have an IDE readily available online, it saves and keeps track of all my programming. I'm barely scratching the surface of it right now, and I'm sure there is much more to it.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;code&gt;rand&lt;/code&gt; is based off the Mersenne Twister algorithm. It generates random numbers from a seed value. This seed value can be called with &lt;code&gt;srand&lt;/code&gt;, and by default is based on the computer's clock. For a given &lt;code&gt;srand&lt;/code&gt;, &lt;code&gt;rand&lt;/code&gt; will generate the same sequence of numbers. The &lt;code&gt;rand&lt;/code&gt; is random enough for lower stake application, but can technically be predicted if one can observe 624 numbers in the sequence! For cryptography, the module &lt;code&gt;SecureRandom&lt;/code&gt; is the way to go!&lt;br&gt;
&lt;code&gt;.sample&lt;/code&gt; uses &lt;code&gt;rand&lt;/code&gt; to pick a random element in an array.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;code&gt;gsub&lt;/code&gt; can be used with a block. I learned this while trying to use a Hash for encrypting and decrypting a message:&lt;br&gt;
&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight ruby"&gt;&lt;code&gt;&lt;span class="k"&gt;def&lt;/span&gt; &lt;span class="nf"&gt;encrypting&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;secret&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
  &lt;span class="n"&gt;code&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="s2"&gt;"a"&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="s2"&gt;"1"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
    &lt;span class="s2"&gt;"e"&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="s2"&gt;"2"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
    &lt;span class="s2"&gt;"i"&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="s2"&gt;"3"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
    &lt;span class="s2"&gt;"o"&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="s2"&gt;"4"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
    &lt;span class="s2"&gt;"u"&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="s2"&gt;"5"&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;
  &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="n"&gt;secret&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;gsub&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="sr"&gt;/[aeiou]/i&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="o"&gt;|&lt;/span&gt;&lt;span class="n"&gt;match&lt;/span&gt;&lt;span class="o"&gt;|&lt;/span&gt; &lt;span class="n"&gt;code&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;fetch&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="n"&gt;match&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;downcase&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="k"&gt;end&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



</description>
      <category>beginners</category>
      <category>webdev</category>
      <category>programming</category>
      <category>ruby</category>
    </item>
    <item>
      <title>TIL about interesting CSS resources</title>
      <dc:creator>Thierry Chau</dc:creator>
      <pubDate>Tue, 18 Jul 2023 04:15:45 +0000</pubDate>
      <link>https://dev.to/thierrychau/til-about-interesting-css-resources-g5c</link>
      <guid>https://dev.to/thierrychau/til-about-interesting-css-resources-g5c</guid>
      <description>&lt;p&gt;While slowly progressing through TechPrep, I found out about some very cool resources to practice CSS.&lt;/p&gt;

&lt;p&gt;Here are some of my favorite ones.&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://flexboxfroggy.com/"&gt;Flexbox Froggy&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--6Lig9TmP--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://flexboxfroggy.com/images/screenshot.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--6Lig9TmP--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://flexboxfroggy.com/images/screenshot.png" alt="Flexbox Froggy" width="800" height="413"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;It is kind of silly but also so useful. I will probably get back to it several more times until it sticks.&lt;/p&gt;

&lt;p&gt;Also learned some interesting things about CSS : when setting the direction to reverse, start and end are also reversed. It makes sense, but good to know!&lt;/p&gt;

&lt;p&gt;&lt;code&gt;#pond {&lt;br&gt;
  display: flex;&lt;br&gt;
  flex-direction:row-reverse;&lt;br&gt;
  justify-content:flex-end;&lt;br&gt;
}&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;Although, reversing the row does not reverse start and end for align-items. Makes sense also!&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://www.happyhues.co/"&gt;Happy Hues&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--nzyeJG-g--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://i.gzn.jp/img/2019/12/17/happyhues/00003.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--nzyeJG-g--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://i.gzn.jp/img/2019/12/17/happyhues/00003.png" alt="Happy Hues" width="800" height="505"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Super neat tool to give some nice color associations, with all the HEX code needed implemented within previews!&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://pocoloco.io/"&gt;pocoloco: to generate a dynamic background&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--t7bY3okk--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://pocoloco.io/landing.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--t7bY3okk--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_800/https://pocoloco.io/landing.jpg" alt="pocoloco" width="792" height="766"&gt;&lt;/a&gt;&lt;/p&gt;

</description>
    </item>
    <item>
      <title>TIL about inline CSS in html... and went down a rabbit hole</title>
      <dc:creator>Thierry Chau</dc:creator>
      <pubDate>Sat, 15 Jul 2023 05:22:13 +0000</pubDate>
      <link>https://dev.to/thierrychau/til-about-inline-css-in-html-and-went-down-a-rabbit-hole-p58</link>
      <guid>https://dev.to/thierrychau/til-about-inline-css-in-html-and-went-down-a-rabbit-hole-p58</guid>
      <description>&lt;p&gt;Not much happening today, but I got curious about how web browsers read html and CSS under the hood...&lt;/p&gt;

&lt;p&gt;This spring I went through FreeCodeCamp's "Responsive Web Design" module, learning about html and CSS for the first time. They guided me straight to "the right way" of setting up an external stylesheet.&lt;/p&gt;

&lt;p&gt;For TechPrep 2.0, one of the module is to go through Codecademy introduction to CSS. Although they say right away that this is not necessarily useful, I learned that I could inject CSS code straight into an html page.&lt;/p&gt;

&lt;p&gt;Which got me thinking: "is html and CSS just the same language?"&lt;/p&gt;

&lt;p&gt;I asked GP-TA, whose response was:&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Yes, HTML and CSS are indeed two distinct languages, each with their own syntax, rules, and purposes.&lt;br&gt;
HTML (HyperText Markup Language) is a markup language used for creating the structure and content of a webpage. It consists of various elements or tags that represent different types of content - headings, paragraphs, links, images, etc.&lt;br&gt;
CSS (Cascading Style Sheets), on the other hand, is a style sheet language used for describing the look and formatting of a document written in HTML. It deals with the presentation aspects like layout, colors, fonts, etc.&lt;br&gt;
The fact that you can write CSS inline within an HTML document doesn’t make them the same language. It’s just a way to apply CSS styles directly to HTML elements. However, it’s generally recommended to separate your CSS into its own file or at least in a style tag in the head of the document to keep styles separate from content, which makes your code more maintainable and easier to understand.&lt;br&gt;
In other words, HTML and CSS work together to create a complete web page, but they have different roles and are distinct languages.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;Fair enough, but not entirely convinced. &lt;/p&gt;

&lt;p&gt;This led me down a rabbit hole of googling how computers interpret html and CSS on a lower level... &lt;/p&gt;

&lt;p&gt;Which led me to the concept of DOM trees. DOM stands for "Document Object Model". I think it has to do with how a web browser first reads through html code to understand the relationship and hierarchy within it. But it is getting late here and I am not reinventing the internet tonight...&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--2EBENjq---/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5rj6pfzwpmoos54biyji.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--2EBENjq---/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_800/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5rj6pfzwpmoos54biyji.gif" alt="DOM tree" width="754" height="689"&gt;&lt;/a&gt;&lt;br&gt;
&lt;em&gt;A DOM tree&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Edit: I kept on reading. Turns out, there is a sister tree, the CSSOM (CSS Objet Model)(and then I think also more trees for Javascript???). And then the browser processes a render tree (so at this point it's basically a forest) which is basically how the trees are related to each other [insert mindblown emoji].&lt;/p&gt;

</description>
    </item>
  </channel>
</rss>
