<?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>Forem: Collins Ruto</title>
    <description>The latest articles on Forem by Collins Ruto (@collinsruto).</description>
    <link>https://forem.com/collinsruto</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%2F839445%2Fd22f2472-b125-467f-aacc-fbb854a8e666.jpg</url>
      <title>Forem: Collins Ruto</title>
      <link>https://forem.com/collinsruto</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://forem.com/feed/collinsruto"/>
    <language>en</language>
    <item>
      <title>Fix: Qualcomm QCNFA765 WiFi Disappears After Suspend on Arch Linux (Hyprland)</title>
      <dc:creator>Collins Ruto</dc:creator>
      <pubDate>Wed, 11 Feb 2026 11:55:36 +0000</pubDate>
      <link>https://forem.com/collinsruto/fix-qualcomm-qcnfa765-wifi-disappears-after-suspend-on-arch-linux-hyprland-2c8i</link>
      <guid>https://forem.com/collinsruto/fix-qualcomm-qcnfa765-wifi-disappears-after-suspend-on-arch-linux-hyprland-2c8i</guid>
      <description>&lt;h2&gt;
  
  
  Intro
&lt;/h2&gt;

&lt;p&gt;If you're running &lt;strong&gt;Arch Linux (especially with Hyprland)&lt;/strong&gt; and your WiFi works after boot but disappears after locking or suspending, this post is for you.&lt;/p&gt;

&lt;p&gt;This issue affects systems using:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;Qualcomm QCNFA765&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;Kernel driver: &lt;code&gt;ath11k_pci&lt;/code&gt;
&lt;/li&gt;
&lt;li&gt;NetworkManager + wpa_supplicant&lt;/li&gt;
&lt;li&gt;GRUB managed by another distro (e.g., Ubuntu in a triple boot setup)&lt;/li&gt;
&lt;/ul&gt;




&lt;h2&gt;
  
  
  The Problem
&lt;/h2&gt;

&lt;p&gt;WiFi works normally after reboot.&lt;/p&gt;

&lt;p&gt;But after:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Locking the system
&lt;/li&gt;
&lt;li&gt;Suspending
&lt;/li&gt;
&lt;li&gt;Disconnecting and reconnecting
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;You get:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;nmcli device wifi connect &amp;lt;ssid&amp;gt;&lt;/code&gt; --ask → &lt;strong&gt;timeout&lt;/strong&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;nmcli device&lt;/code&gt; → no WiFi device listed&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;ip link&lt;/code&gt; → no &lt;code&gt;wlan0&lt;/code&gt; or &lt;code&gt;wlp*&lt;/code&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;rfkill list&lt;/code&gt; → not blocked&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The WiFi interface disappears completely until reboot.&lt;/p&gt;




&lt;h2&gt;
  
  
  Diagnosis
&lt;/h2&gt;

&lt;p&gt;Check your WiFi chipset:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;lspci &lt;span class="nt"&gt;-k&lt;/span&gt; | &lt;span class="nb"&gt;grep&lt;/span&gt; &lt;span class="nt"&gt;-A4&lt;/span&gt; &lt;span class="nt"&gt;-Ei&lt;/span&gt; &lt;span class="s1"&gt;'network|wireless'&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;If you see:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Qualcomm Technologies QCNFA765
Kernel driver in use: ath11k_pci
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;You're hitting a known power management bug.&lt;/p&gt;




&lt;h2&gt;
  
  
  Root Cause
&lt;/h2&gt;

&lt;p&gt;The &lt;code&gt;ath11k_pci&lt;/code&gt; driver sometimes:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Enters a deep idle power state (D3cold)&lt;/li&gt;
&lt;li&gt;Fails to resume properly after suspend&lt;/li&gt;
&lt;li&gt;The kernel drops the WiFi interface&lt;/li&gt;
&lt;li&gt;NetworkManager can no longer see a device&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;This is a resume power-state issue with ath11k chipsets.&lt;/p&gt;




&lt;h2&gt;
  
  
  Temporary Fix (No Reboot)
&lt;/h2&gt;

&lt;p&gt;Reloading the driver restores WiFi:&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;sudo &lt;/span&gt;modprobe &lt;span class="nt"&gt;-r&lt;/span&gt; ath11k_pci
&lt;span class="nb"&gt;sudo &lt;/span&gt;modprobe ath11k_pci
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;After that:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;ip &lt;span class="nb"&gt;link&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Your WiFi interface should return.&lt;/p&gt;

&lt;p&gt;This confirms the issue is driver-related.&lt;/p&gt;




&lt;h2&gt;
  
  
  Permanent Fix
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Disable ath11k Idle Power Saving
&lt;/h3&gt;

&lt;p&gt;Add this kernel parameter:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;ath11k_pci.disable_idle_ps=1
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This prevents the driver from entering the unstable idle state.&lt;/p&gt;




&lt;h3&gt;
  
  
  If you use GRUB
&lt;/h3&gt;

&lt;p&gt;Edit:&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;sudo &lt;/span&gt;nano /etc/default/grub
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Find:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;GRUB_CMDLINE_LINUX_DEFAULT="..."
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Append:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;ath11k_pci.disable_idle_ps=1
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Example:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;GRUB_CMDLINE_LINUX_DEFAULT="quiet splash ath11k_pci.disable_idle_ps=1"
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Regenerate GRUB:&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;sudo &lt;/span&gt;update-grub
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Verify:&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;cat&lt;/span&gt; /proc/cmdline
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;You should see:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;ath11k_pci.disable_idle_ps=1
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Done.&lt;/p&gt;




&lt;h3&gt;
  
  
  Alternative: Auto-Reload Driver on Resume (Arch Only)
&lt;/h3&gt;

&lt;p&gt;If you prefer not to modify GRUB, create a resume hook.&lt;/p&gt;

&lt;p&gt;Create:&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;sudo &lt;/span&gt;nano /usr/lib/systemd/system-sleep/ath11k-resume
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Add:&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="c"&gt;#!/bin/sh&lt;/span&gt;
&lt;span class="k"&gt;case&lt;/span&gt; &lt;span class="s2"&gt;"&lt;/span&gt;&lt;span class="nv"&gt;$1&lt;/span&gt;&lt;span class="s2"&gt;"&lt;/span&gt; &lt;span class="k"&gt;in
  &lt;/span&gt;post&lt;span class="p"&gt;)&lt;/span&gt;
    /usr/bin/systemctl restart NetworkManager
    /usr/bin/modprobe &lt;span class="nt"&gt;-r&lt;/span&gt; ath11k_pci 2&amp;gt;/dev/null
    /usr/bin/modprobe ath11k_pci
    /usr/bin/systemctl restart NetworkManager
    &lt;span class="p"&gt;;;&lt;/span&gt;
&lt;span class="k"&gt;esac&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Make executable:&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;sudo chmod&lt;/span&gt; +x /usr/lib/systemd/system-sleep/ath11k-resume
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Now WiFi will recover automatically after suspend.&lt;/p&gt;




&lt;h2&gt;
  
  
  Summary
&lt;/h2&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Issue&lt;/th&gt;
&lt;th&gt;Cause&lt;/th&gt;
&lt;th&gt;Fix&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;WiFi disappears after suspend&lt;/td&gt;
&lt;td&gt;ath11k idle power-state bug&lt;/td&gt;
&lt;td&gt;Disable idle power saving&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;
&lt;code&gt;ip link&lt;/code&gt; shows no wlan device&lt;/td&gt;
&lt;td&gt;Driver failed resume&lt;/td&gt;
&lt;td&gt;Reload &lt;code&gt;ath11k_pci&lt;/code&gt;
&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;nmcli timeout&lt;/td&gt;
&lt;td&gt;No kernel interface&lt;/td&gt;
&lt;td&gt;Fix power state&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;




&lt;h2&gt;
  
  
  Final Thoughts
&lt;/h2&gt;

&lt;p&gt;This issue can be confusing because:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;NetworkManager looks broken&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;nmcli&lt;/code&gt; times out&lt;/li&gt;
&lt;li&gt;No device appears&lt;/li&gt;
&lt;li&gt;Reboot "magically" fixes it&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;But the real culprit is &lt;code&gt;ath11k&lt;/code&gt; power management during suspend.&lt;/p&gt;

&lt;p&gt;If you're running Hyprland on Arch with Qualcomm WiFi and experiencing this, hopefully this saves you a few hours.&lt;/p&gt;

&lt;p&gt;Happy hacking 🐧&lt;/p&gt;

</description>
      <category>archlinux</category>
      <category>linux</category>
      <category>networking</category>
      <category>hyprland</category>
    </item>
    <item>
      <title>GitHub SSH for Linux &amp; ALX SandBox</title>
      <dc:creator>Collins Ruto</dc:creator>
      <pubDate>Mon, 26 Jun 2023 20:53:01 +0000</pubDate>
      <link>https://forem.com/collinsruto/github-ssh-for-linux-alx-sandbox-37mp</link>
      <guid>https://forem.com/collinsruto/github-ssh-for-linux-alx-sandbox-37mp</guid>
      <description>&lt;h2&gt;
  
  
  Introduction
&lt;/h2&gt;

&lt;p&gt;GitHub SSH (Secure Shell) is a secure protocol used to establish a secure encrypted connection between a local machine and GitHub's remote servers. It allows you to securely authenticate and communicate with GitHub without relying github token and also since passwords deprecated and unsuported.&lt;/p&gt;

&lt;p&gt;When using SSH with GitHub, you generate a key pair consisting of a public key and a private key. The public key is stored on GitHub, while the private key remains on your local machine. The private key should be kept confidential and protected with a passphrase.&lt;/p&gt;

&lt;h2&gt;
  
  
  Sandbox/Terminal setup
&lt;/h2&gt;

&lt;p&gt;To begin, go to your &lt;a href="https://intranet.alxswe.com/user_containers/current" rel="noopener noreferrer"&gt;ALX Sandbox&lt;/a&gt; and run your sandbox through your preferred method.&lt;/p&gt;

&lt;h3&gt;
  
  
  Generate SSH key
&lt;/h3&gt;

&lt;p&gt;To generate your ssh key, run the following command on your sandbox/terminal.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;ssh-keygen -t ed25519 -C "your_email@example.com"
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;You will be prompted to Enter a file in which to save the key, press enter to save in the default location. You will then be prompted to enter a passphrase, just press enter or input one and repeat the same if you prefer it.&lt;/p&gt;

&lt;h3&gt;
  
  
  Get your SSH key
&lt;/h3&gt;

&lt;p&gt;The generated SSH key is now stored in the &lt;code&gt;~/.ssh/id_ed25519&lt;/code&gt; directory. To access the new SSH public key, run the command below then select and copy the output.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;cat ~/.ssh/id_ed25519.pub
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Copy this value as it is required for later steps in setting up GitHub.&lt;br&gt;
The output should something similar to:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;ssh-ed25519 Some-long-string-of-characters-here your-email@gmail.com
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  GitHub Setup
&lt;/h2&gt;

&lt;p&gt;Now we need to add our generated SSH public key to GitHub account.&lt;br&gt;
Click &lt;a href="https://github.com/settings/ssh/new" rel="noopener noreferrer"&gt;here&lt;/a&gt; and you will be directed to your GitHub new SSH Keys page.&lt;br&gt;&lt;br&gt;
Alternatively, go to your GitHub account settings and navigate to the "SSH and GPG keys" section and click on "New SSH key".&lt;br&gt;
You should see a similar page.  &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fdv7chx2kyvtf7cabs5qt.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fdv7chx2kyvtf7cabs5qt.png" alt="Add SSH GitHub" width="800" height="403"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;On mobile phones, scroll down to the section.&lt;br&gt;&lt;br&gt;
On the Title input field, give your ssh key a name e.g "ALX-Sandbox".&lt;br&gt;&lt;br&gt;
Thereafter on the key input field, paste the public key that we copied from the sandbox output.&lt;br&gt;&lt;br&gt;
Click Add SSH key.&lt;br&gt;&lt;br&gt;
You will be prompted to enter you GitHub account password to authorize adding the Key.&lt;/p&gt;
&lt;h2&gt;
  
  
  Update your git identity
&lt;/h2&gt;

&lt;p&gt;If you haven't updated your git identity on your sandbox/terminal before, do the following commands and be sure to substitute with your actual username and email:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;git config --global user.email "you@example.com"
git config --global user.name "Your Name"
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This helps to create a local git profile for local git commits and activities.&lt;/p&gt;

&lt;h1&gt;
  
  
  3 Test
&lt;/h1&gt;

&lt;p&gt;Now that we have successfully added our public key to github, we have to test our connection.&lt;br&gt;&lt;br&gt;
Open up your sandbox and run the following:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;ssh -T git@github.com
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This attempts to connect to GitHub via ssh. If everything is set correctly, it would return something like this:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;The authenticity of host 'github.com (IP ADDRESS)' can't be established.
ED25519 key fingerprint is SHA256:+....&amp;gt; Are you sure you want to continue connecting (yes/no)?
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Type &lt;code&gt;yes&lt;/code&gt; on the terminal to confirm.&lt;br&gt;&lt;br&gt;
You are now connected!&lt;/p&gt;
&lt;h2&gt;
  
  
  Using SSH
&lt;/h2&gt;

&lt;p&gt;Lets try using the new ssh in a real project.&lt;br&gt;&lt;br&gt;
Firstly create a new repository here: &lt;a href="https://github.com/new" rel="noopener noreferrer"&gt;new empty repository&lt;/a&gt; and give a name and optional description.&lt;br&gt;&lt;br&gt;
Do NOT select add README file, .gitignore or license.  &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fhbf7h6c19jo1kgre6aqh.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fhbf7h6c19jo1kgre6aqh.png" alt="New github repository" width="647" height="579"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;click on 'create repository'.  &lt;/p&gt;
&lt;h2&gt;
  
  
  Cloning the repository
&lt;/h2&gt;

&lt;p&gt;You will be navigated to the created repository page. Click on the ssh tab as shown below arrow 1: &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F72oyfmz2i3w0au7nhujn.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F72oyfmz2i3w0au7nhujn.png" alt="Git SSH" width="800" height="343"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Copy the preceding git ssh url, substituting for your username and the name of your repository. Which in the case of the screenshot above is like so on arrow 2:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;git@github.com:your-username-here/repo-name-here.git
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;On your terminal/sandbox, clone the repo by running the following, substituting for your username and the name of your repository:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;git clone git@github.com:your-username-here/repo-name-here.git
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This should create an empty directory with name repo_name_here inside it. You may now make changes to your project as you wish and push them to GitHub directly. Go to your repository and refresh the page to confirm changes.   &lt;/p&gt;

&lt;p&gt;If you are asked to authorize your SSH key after running &lt;code&gt;git push&lt;/code&gt; as such:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;The authenticity of host 'github.com (IP ADDRESS)' can't be established.
ED25519 key fingerprint is SHA256:+....&amp;gt; Are you sure you want to continue connecting (yes/no)?
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Type &lt;code&gt;yes&lt;/code&gt; on the terminal to confirm.&lt;br&gt;&lt;br&gt;
You are now connected and your changes will be pushed.&lt;/p&gt;

</description>
      <category>ssh</category>
      <category>github</category>
      <category>alx</category>
      <category>linux</category>
    </item>
    <item>
      <title>Add Google Analytics to Next.Js 13.4 app dir</title>
      <dc:creator>Collins Ruto</dc:creator>
      <pubDate>Sat, 03 Jun 2023 14:10:26 +0000</pubDate>
      <link>https://forem.com/collinsruto/add-google-analyticts-to-nextjs-134-app-dir-51c5</link>
      <guid>https://forem.com/collinsruto/add-google-analyticts-to-nextjs-134-app-dir-51c5</guid>
      <description>&lt;h2&gt;
  
  
  Intro
&lt;/h2&gt;

&lt;p&gt;Google Analytics is a powerful web analytics tool that provides valuable insights into your website traffic and monitor user behavior. Integrating Google Analytics into your Next.js application allows you to track and analyze user interactions, measure marketing campaign effectiveness, and make data-driven decisions. We will explore the steps to set up Google Analytics (gtag.js) in a Next.js application.&lt;/p&gt;

&lt;h2&gt;
  
  
  Google analytics account setup
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;First, visit the &lt;a href="https://analytics.google.com" rel="noopener noreferrer"&gt;Google Analytics Website&lt;/a&gt; and sign up using your google account.&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Start the Account setup then create a new property for your Next.js application and provide the details asked. After completing the setup, you will be taken to a new platform page for your account.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Select the platform for your project, in this case that will be web.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media.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%2Fhv1m7dvjywuqmvo53m09.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.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%2Fhv1m7dvjywuqmvo53m09.png" alt="Image of choose platform page" width="800" height="396"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Enter the website url of where you next app is hosted and give a prefered name. Click on create stream to continue.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media.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%2Fcmrh1vrmatatj7llsaqo.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.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%2Fcmrh1vrmatatj7llsaqo.png" alt="website url and name page" width="800" height="395"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Once the property stream created, you will be taken to a page similar to the one below. Note down the Property ID. It should be in the format G-XXXXXXXXX.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media.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%2Fhuwyi1sgj05r70fvb380.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.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%2Fhuwyi1sgj05r70fvb380.png" alt="Property ID page" width="800" height="394"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Initialize Next.js project
&lt;/h2&gt;

&lt;p&gt;Setup your Next.Js project as per &lt;a href="https://nextjs.org/" rel="noopener noreferrer"&gt;https://nextjs.org/&lt;/a&gt; specifications.&lt;/p&gt;

&lt;p&gt;This should work just fine:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;npx create-next-app@latest your-next-app
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Environment variables
&lt;/h2&gt;

&lt;p&gt;In the root directory of your project, you should have an environment &lt;code&gt;.env.local&lt;/code&gt; file. If that is not the case, you can create a file by the same name. Add your property ID that we copied earlier here.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;NEXT_PUBLIC_GOOGLE_ANALYTICS= 'G-XXXXXXXX'
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Create a google analytics Component
&lt;/h2&gt;

&lt;p&gt;Create a components folder or any folder of your choice outside of the app directory and within your project directory, preferably within the &lt;code&gt;src&lt;/code&gt; directory. In the components folder create a &lt;code&gt;GoogleAnalytics.tsx&lt;/code&gt; file.&lt;br&gt;
In the file copy the code below and save it.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;import Script from "next/script";

const GoogleAnalytics = ({ ga_id }: { ga_id: string }) =&amp;gt; (
  &amp;lt;&amp;gt;
    &amp;lt;Script
      async
      src={`https://www.googletagmanager.com/gtag/js? 
      id=${ga_id}`}
    &amp;gt;&amp;lt;/Script&amp;gt;
    &amp;lt;Script
      id="google-analytics"
      dangerouslySetInnerHTML={{
        __html: `
          window.dataLayer = window.dataLayer || [];
          function gtag(){dataLayer.push(arguments);}
          gtag('js', new Date());

          gtag('config', '${ga_id}');
        `,
      }}
    &amp;gt;&amp;lt;/Script&amp;gt;
  &amp;lt;/&amp;gt;
);
export default GoogleAnalytics;

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Render the component in the Layout file
&lt;/h2&gt;

&lt;p&gt;In the root &lt;code&gt;layout.tsx&lt;/code&gt; file in the &lt;code&gt;app&lt;/code&gt; directory, import your GoogleAnalytics component like so:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;import GoogleAnalytics from "~/components/GoogleAnalytics";
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;You can then modify your code to match the format below.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
      &amp;lt;html lang="en"&amp;gt;
        &amp;lt;body&amp;gt;
          {process.env.NEXT_PUBLIC_GOOGLE_ANALYTICS &amp;amp;&amp;amp; (
            &amp;lt;GoogleAnalytics ga_id= 
            {process.env.NEXT_PUBLIC_GOOGLE_ANALYTICS} /&amp;gt;
          )}
          // ... your other code content here.
        &amp;lt;/body&amp;gt;
      &amp;lt;/html&amp;gt;
  );
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Run your app
&lt;/h2&gt;

&lt;p&gt;On your terminal, run the following to start your app.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;npm run dev
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;On the browser, navigate to your next app live url, most likely it will be &lt;code&gt;http://localhost:3000&lt;/code&gt;&lt;br&gt;
Open the browser console.&lt;br&gt;
On the console, type &lt;code&gt;datalayer&lt;/code&gt;. If you see an output similar to the one below then, Yaay 🎉 you did it!&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.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%2Fhqpodk56nsr4ns4yyth4.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.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%2Fhqpodk56nsr4ns4yyth4.png" alt="image of output for typing datalayer" width="800" height="111"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Host your app
&lt;/h2&gt;

&lt;p&gt;If you are planning to host your site, be sure to add your property in your hosting service project settings. You should find the environment variables settings and add you ID with the same keyname as used in the project &lt;code&gt;.env.local&lt;/code&gt; file.&lt;/p&gt;

&lt;p&gt;You can now go to the analytics dashboard and click on the live button, where you will see the information about the application in real-time!&lt;/p&gt;

&lt;p&gt;For any follow up or questions, reach out through any of the following:&lt;br&gt;
My &lt;a href="https://collinsruto.netlify.app" rel="noopener noreferrer"&gt;Personal website&lt;/a&gt;, &lt;a href="https://collinsruto.vercel.app" rel="noopener noreferrer"&gt;My Blogs&lt;/a&gt;, &lt;a href="https://twitter.com/Ruto_Collins_" rel="noopener noreferrer"&gt;Twitter&lt;/a&gt;, &lt;a href="https://github.com/Collins-Ruto" rel="noopener noreferrer"&gt;Github&lt;/a&gt; or &lt;a href="https://www.linkedin.com/in/collins-ruto" rel="noopener noreferrer"&gt;linkedin&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Sample github project:&lt;br&gt;
&lt;a href="https://github.com/collins-ruto/learnhq" rel="noopener noreferrer"&gt;https://github.com/collins-ruto/learnhq&lt;/a&gt;&lt;/p&gt;

</description>
      <category>nextjs</category>
      <category>analytics</category>
      <category>google</category>
      <category>typescript</category>
    </item>
    <item>
      <title>Write response from a rust function to a file</title>
      <dc:creator>Collins Ruto</dc:creator>
      <pubDate>Sat, 03 Dec 2022 06:22:38 +0000</pubDate>
      <link>https://forem.com/collinsruto/write-response-from-a-rust-function-to-a-file-141a</link>
      <guid>https://forem.com/collinsruto/write-response-from-a-rust-function-to-a-file-141a</guid>
      <description>&lt;p&gt;If you want to save the response from a function for later, you can use the &lt;code&gt;std::fs::write&lt;/code&gt; function to write the response to a file on your local file system.&lt;/p&gt;

&lt;p&gt;For example, suppose you have a Rust function named &lt;code&gt;my_function&lt;/code&gt; that returns a String containing the response you want to save. You can use the following code to write the response to a file named &lt;code&gt;response.txt&lt;/code&gt;:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;use std::fs;

fn my_function() -&amp;gt; String {
    // function body goes here
}

fn main() {
    let response = my_function();

    fs::write("response.txt", response).expect("Failed to write response to file");
}

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This will create a new file named &lt;code&gt;response.txt&lt;/code&gt; in the current directory, and write the response from the &lt;code&gt;my_function&lt;/code&gt; function to the file. If the file already exists, it will be overwritten with the new response.&lt;/p&gt;

&lt;p&gt;You can then use the &lt;code&gt;std::fs::read_to_string&lt;/code&gt; function to read the saved response from the file at a later time:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;use std::fs;

fn main() {
    let response = fs::read_to_string("response.txt").expect("Failed to read response from file");

    // use the response here
}

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;I hope this helps! Let me know if you have any other questions.&lt;/p&gt;

</description>
      <category>watercooler</category>
    </item>
    <item>
      <title>Send a HashMap as parameters to a rust smart contract</title>
      <dc:creator>Collins Ruto</dc:creator>
      <pubDate>Sat, 03 Dec 2022 05:57:20 +0000</pubDate>
      <link>https://forem.com/collinsruto/send-a-hashmap-as-parameters-to-a-rust-smart-contract-2gd4</link>
      <guid>https://forem.com/collinsruto/send-a-hashmap-as-parameters-to-a-rust-smart-contract-2gd4</guid>
      <description>&lt;p&gt;To send a HashMap as a parameter to a Rust function from the &lt;code&gt;near-cli&lt;/code&gt;, you can use the &lt;code&gt;--arg&lt;/code&gt; flag to specify the key-value pairs of the map as command-line arguments. The &lt;code&gt;--arg&lt;/code&gt; flag takes two arguments: the key and the value, separated by a &lt;code&gt;=&lt;/code&gt; sign.&lt;/p&gt;

&lt;p&gt;For example, suppose you have a Rust function named &lt;code&gt;my_function&lt;/code&gt; that takes a &lt;code&gt;HashMap&amp;lt;String, String&amp;gt;&lt;/code&gt; as an argument. You could call this function from the &lt;code&gt;near-cli&lt;/code&gt; using the following command:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;near call &amp;lt;contract_name&amp;gt; my_function --arg key1=value1 --arg key2=value2

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This would pass a HashMap with two entries to the &lt;code&gt;my_function&lt;/code&gt; function, where the keys are "key1" and "key2", and the corresponding values are "value1" and "value2", respectively.&lt;/p&gt;

&lt;p&gt;Inside the my_function function, you can access the HashMap argument using the &lt;code&gt;std::env::args&lt;/code&gt; method, which returns an iterator over the command-line arguments passed to the function. You can then use the &lt;code&gt;Iterator::filter&lt;/code&gt; method to filter the arguments for those with the &lt;code&gt;--arg&lt;/code&gt; flag, and the &lt;code&gt;Iterator::map&lt;/code&gt; method to map each argument to a tuple containing the key and value. Finally, you can use the &lt;code&gt;Iterator::collect&lt;/code&gt; method to collect the tuples into a HashMap:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;use std::collections::HashMap;
use std::env;

fn my_function(map: HashMap&amp;lt;String, String&amp;gt;) {
    // function body goes here
}

#[near_bindgen]
impl MyContract {
    pub fn call_my_function() {
        let args: Vec&amp;lt;String&amp;gt; = env::args().collect();
        let map: HashMap&amp;lt;String, String&amp;gt; = args
            .iter()
            .filter(|arg| arg.starts_with("--arg"))
            .map(|arg| arg.split("=").collect::&amp;lt;Vec&amp;lt;&amp;amp;str&amp;gt;&amp;gt;())
            .map(|parts| (parts[0].to_string(), parts[1].to_string()))
            .collect();

        my_function(map);
    }
}

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;I hope this helps! Let me know if you have any other questions.&lt;/p&gt;

</description>
      <category>rust</category>
      <category>near</category>
      <category>web3</category>
      <category>webdev</category>
    </item>
    <item>
      <title>Survey Form</title>
      <dc:creator>Collins Ruto</dc:creator>
      <pubDate>Wed, 30 Mar 2022 17:06:33 +0000</pubDate>
      <link>https://forem.com/collinsruto/survey-form-5d90</link>
      <guid>https://forem.com/collinsruto/survey-form-5d90</guid>
      <description>&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/collins-ruto/embed/jOYrONj?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

</description>
      <category>codepen</category>
      <category>webdev</category>
      <category>beginners</category>
      <category>css</category>
    </item>
    <item>
      <title>Web Tribute To Nelson Mandela</title>
      <dc:creator>Collins Ruto</dc:creator>
      <pubDate>Wed, 30 Mar 2022 16:09:04 +0000</pubDate>
      <link>https://forem.com/collinsruto/web-tribute-to-nelson-mandela-2ieo</link>
      <guid>https://forem.com/collinsruto/web-tribute-to-nelson-mandela-2ieo</guid>
      <description>&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/collins-ruto/embed/WNdrOQv?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

</description>
      <category>codepen</category>
      <category>webdev</category>
    </item>
    <item>
      <title>Product landing page</title>
      <dc:creator>Collins Ruto</dc:creator>
      <pubDate>Wed, 30 Mar 2022 16:06:38 +0000</pubDate>
      <link>https://forem.com/collinsruto/product-landing-page-o4p</link>
      <guid>https://forem.com/collinsruto/product-landing-page-o4p</guid>
      <description>&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/collins-ruto/embed/bGagRGo?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

</description>
      <category>codepen</category>
      <category>webdev</category>
      <category>html</category>
    </item>
  </channel>
</rss>
