<?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: Ali Ahsan</title>
    <description>The latest articles on Forem by Ali Ahsan (@aliahsan07).</description>
    <link>https://forem.com/aliahsan07</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%2F63214%2Fee11c79d-110b-4a35-bcb3-e1e49ebf971b.jpg</url>
      <title>Forem: Ali Ahsan</title>
      <link>https://forem.com/aliahsan07</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://forem.com/feed/aliahsan07"/>
    <language>en</language>
    <item>
      <title>This Week in Commits History (GitHub Action)</title>
      <dc:creator>Ali Ahsan</dc:creator>
      <pubDate>Thu, 17 Sep 2020 23:25:55 +0000</pubDate>
      <link>https://forem.com/aliahsan07/this-week-in-commits-history-github-action-1gmi</link>
      <guid>https://forem.com/aliahsan07/this-week-in-commits-history-github-action-1gmi</guid>
      <description>&lt;p&gt;My idea was to have something like Facebook's "On this day" or Snapchat's Memories from today and apply it to a repository. So I started working on this action "Week-History-Action." I figured doing it every day would be another daily spam, so I went along with doing it weekly.&lt;/p&gt;

&lt;p&gt;This action gathers the commits applied to the repo every week and packages them in an email. Every Monday, at 7 AM, the cron job runs, leveraging GitHub's API; every commit from the current date until seven days from now in history gets collected.&lt;/p&gt;

&lt;p&gt;So let's say your repository is two years old and today is Monday, 17th Sept 2020. The action will find commits from 17th Sept 2019 to 23rd Sept 2019 and 17th Sept 2018 to 23rd Sept 2018. All the commits fitting the timeframe will get sent to the interested users via email. For email, I'm using NodeMailer. Currently, the committer's name, email, and date are gleaned along with the commit message.&lt;/p&gt;

&lt;p&gt;This action is still a work in progress. The initial goal was to complete it by 17th Sept 2020, the deadline of the GitHub Actions Hackathon on DEV.&lt;/p&gt;

&lt;p&gt;Unfortunately, due to numerous reasons, this is not complete. I'm merely sharing here for some thoughts from the community. During the development, I realized this might not be a useful action, so I would like to know if someone is interested in developing this with me going forward. This is the repo for those who are interested:&lt;/p&gt;


&lt;div class="ltag-github-readme-tag"&gt;
  &lt;div class="readme-overview"&gt;
    &lt;h2&gt;
      &lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--vJ70wriM--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://practicaldev-herokuapp-com.freetls.fastly.net/assets/github-logo-ba8488d21cd8ee1fee097b8410db9deaa41d0ca30b004c0c63de0a479114156f.svg" alt="GitHub logo"&gt;
      &lt;a href="https://github.com/aliahsan07"&gt;
        aliahsan07
      &lt;/a&gt; / &lt;a href="https://github.com/aliahsan07/Week-History-Action"&gt;
        Week-History-Action
      &lt;/a&gt;
    &lt;/h2&gt;
    &lt;h3&gt;
      
    &lt;/h3&gt;
  &lt;/div&gt;
  &lt;div class="ltag-github-body"&gt;
    
&lt;div id="readme" class="md"&gt;
&lt;h1&gt;
This Week in Commits History&lt;/h1&gt;
&lt;p&gt;This action gathers the commits applied to the repo every week and packages them in an email. Every Monday, at 7 AM, the cron job runs, leveraging GitHub's API; every commit from the current date until seven days from now in history gets collected.&lt;/p&gt;
&lt;p&gt;So let's say your repository is two years old and today is Monday, &lt;strong&gt;17th Sept 2020&lt;/strong&gt;. The action will find commits from &lt;strong&gt;17th Sept 2019&lt;/strong&gt; to &lt;strong&gt;23rd Sept 2019&lt;/strong&gt; and &lt;strong&gt;17th Sept 2018&lt;/strong&gt; to &lt;strong&gt;23rd Sept 2018&lt;/strong&gt;. All the commits fitting the timeframe will get sent to the interested users via email. For email, I'm using NodeMailer. Currently, the committer's name, email, and date are gleaned along with the commit message.&lt;/p&gt;
&lt;p&gt;This action is still a work in progress. The initial goal was to complete it by 17th Sept 2020, the deadline of the GitHub Actions Hackathon on DEV.&lt;/p&gt;…&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="gh-btn-container"&gt;&lt;a class="gh-btn" href="https://github.com/aliahsan07/Week-History-Action"&gt;View on GitHub&lt;/a&gt;&lt;/div&gt;
&lt;/div&gt;


&lt;p&gt;The features are incomplete that will be implemented in the coming days, to name a few:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;The email template to send has to be crafted, it's currently rudimentary, and I had trouble setting up a nice HTML table. &lt;/li&gt;
&lt;li&gt;Configurable options i.e, to limit the number of commits the user gets, if plentiful commits were made in a week might not be wise to send everyone in the mailbox. Also, a notion of "useful" commit would be beneficial so that only the most important commits are sent. &lt;/li&gt;
&lt;li&gt;It's not runnable as of yet; I encounter this issue today:
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight plaintext"&gt;&lt;code&gt;! [remote rejected] main -&amp;gt; main (refusing to allow an OAuth App to create or update workflow `.github/workflows/main.yml` without `workflow` scope)
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;This also needs to be addressed. &lt;/p&gt;

&lt;p&gt;Its a bummer I couldn't complete the action, but I'm glad I got to work on an action and understand what's going on behind the hook. (Lesson learned: Just start early from next time.)&lt;/p&gt;

</description>
      <category>github</category>
      <category>actionshackathon</category>
    </item>
    <item>
      <title>A Primer on GitHub Actions</title>
      <dc:creator>Ali Ahsan</dc:creator>
      <pubDate>Fri, 21 Aug 2020 20:22:48 +0000</pubDate>
      <link>https://forem.com/aliahsan07/a-primer-on-github-actions-24l</link>
      <guid>https://forem.com/aliahsan07/a-primer-on-github-actions-24l</guid>
      <description>&lt;p&gt;&lt;a href="https://dev.to/devteam/announcing-the-github-actions-hackathon-on-dev-3ljn"&gt;DEV&lt;/a&gt; is running a GitHub Actions Hackathon till 17th September, so I figured this might be the right time to dive deep in GitHub Actions.&lt;/p&gt;

&lt;p&gt;GitHub Actions automate the custom workflows inside of GitHub. Kyle Daigle, the director of ecosystem engineering at that time of launch, described Actions as "GitHub running code on your behalf for the first time" on a Changelog podcast. This line will make more sense when we go over a few examples, but this definition alone should give you some idea about how powerful this feature can be.&lt;/p&gt;

&lt;p&gt;One common use case is sending a message in a Slack channel when code is pushed to a repository. The action gets triggered when code is pushed, or it could be when a pull request is created. Similarly, there is an action that reminds the reviewers on Slack to merge the pull request. What is seemingly a simple task has quite an impact as recounted by the creator of &lt;a href="https://pullreminders.com/"&gt;Pull Reminders&lt;/a&gt; himself. Pinging everyone on slack to merge a pull request is a tedious task and might need multiple rounds of messages before every reviewer approves the request. The action automated the reminders thus ensuring speedier review and merge of code (and this is how GitHub is running code for you).&lt;/p&gt;

&lt;h4&gt;Using an action in your codebsase&lt;/h4&gt;

&lt;p&gt;The hackathon folks at Dev are running is looking for developers to build an action. This can be achieved in multiple ways; the two most common are:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Docker container actions&lt;/li&gt;
&lt;li&gt;JavaScript actions&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Right now, I'm going over how to use an existing action (tonnes of GitHub actions present in the marketplace) in your codebase.&lt;/p&gt;

&lt;p&gt;To configure a workflow inside your repository, create a YAML file inside (.yml/.yaml) inside the &lt;code&gt;.github/workflows&lt;/code&gt; directory. The official documentation delineates how to create an action and the various properties that are associated with it. I'll give a small example and discern the key components of it. &lt;/p&gt;

&lt;p&gt;The following configuration sets up a unit suite to run whenever a pull request is created against the master branch on a node application. (Full Disclosure: The snippet is inspired by this &lt;a href="https://www.youtube.com/watch?v=F3wZTDmHCFA"&gt;Youtube Video&lt;/a&gt;)&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight plaintext"&gt;&lt;code&gt;name: Node Unit Tests

on:
  pull_request:
    branches:
      - master

jobs:
  test:
    name: Running Unit Tests
    runs-on: ubuntu-latest

    steps:
    uses: actions/checkout@v2
    name: Use Node.js ${{ matrix.node-version }}

    uses: actions/setup-node@v2
    with:
      node-version: ${{ matrix.node-version }}
    - name: installing dependencies
      run: npm install
    - nam: running tests
      run: npm test

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



&lt;p&gt;&lt;code&gt;name&lt;/code&gt; defines the title of the GitHub Action.&lt;br&gt;
&lt;code&gt;on&lt;/code&gt; is required, which specifies the GitHub event that triggers the workflow. In this example, a pull request to the master branch stimulates the proceedings. &lt;br&gt;
&lt;code&gt;jobs&lt;/code&gt; make up a workflow. They run in parallel by default. Here, we have one job we call &lt;code&gt;test&lt;/code&gt;. Inside it, we name the job &lt;code&gt;Running Unit Tests&lt;/code&gt;. It's running on &lt;code&gt;ubuntu-latest&lt;/code&gt; container. This is followed by the steps the workflow carries out. &lt;br&gt;
&lt;code&gt;uses&lt;/code&gt; refers to the action we're using, the first action is &lt;code&gt;actions/checkout@v2&lt;/code&gt; which checkouts your repository so that your workflow can access it. The next step is more interesting in which we use &lt;code&gt;actions/setup-node@v2&lt;/code&gt; action to install node dependencies and run &lt;code&gt;npm test&lt;/code&gt;. The &lt;code&gt;name&lt;/code&gt; gets printed whenever the corresponding step starts executing, so it's imperative to write meaningful names. &lt;code&gt;installing dependencies&lt;/code&gt; and then &lt;code&gt;running tests&lt;/code&gt; will give the user a good sense of how the flow is executing. Both of the actions used in this example are open-source.&lt;/p&gt;

&lt;p&gt;Using an existing action in your codebase is usually very straightforward. Let's say you want to delete a branch when the pull request is merged from that branch—a fairly common use case, which prevents the accumulation of unused branches. There is an action &lt;a href="https://github.com/marketplace/actions/delete-merged-branch"&gt;Delete merged branch&lt;/a&gt; in the marketplace that you can use for it. The YAML file can be as follows:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight plaintext"&gt;&lt;code&gt;  name: Delete merged branch
  uses: SvanBoxel/delete-merged-branch@v1.3.3
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;That's it, that takes care of branches merged into your codebase. I just had to visit the repo of the &lt;a href="(https://github.com/marketplace/actions/delete-merged-branch)"&gt;action&lt;/a&gt; and copy this small snippet to make it work. Of course, you can modify the workflow to suit your needs but this gets the ball rolling for a very minimal setup.&lt;/p&gt;

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

&lt;p&gt;As we move towards the hackathon deadline, I'm searching the web and brainstorming ideas about possible useful action. You're allowed to use any open source technology to build your own GitHub Action, which makes the competition more broad and exciting. I intend to write next on what goes on under the hood and convey a better understanding of the internals. For now, I'm focusing on building a badass GitHub Action that will win me the grand prize 🤩&lt;/p&gt;

&lt;p&gt;(This post originally appeared on &lt;a href="https://aliahsan.tech/github-actions"&gt;https://aliahsan.tech/github-actions&lt;/a&gt;)&lt;/p&gt;

</description>
      <category>actionshackathon</category>
      <category>opensource</category>
      <category>github</category>
      <category>blog</category>
    </item>
    <item>
      <title>Covid Relief Pakistan</title>
      <dc:creator>Ali Ahsan</dc:creator>
      <pubDate>Fri, 01 May 2020 03:46:05 +0000</pubDate>
      <link>https://forem.com/aliahsan07/covid-relief-pakistan-289h</link>
      <guid>https://forem.com/aliahsan07/covid-relief-pakistan-289h</guid>
      <description>&lt;h3&gt;
  
  
  Category: COVID-19 Communications
&lt;/h3&gt;



&lt;h3&gt;
  
  
  The arrival of the holy month of Ramadan coincides with the worst days of the virus in Pakistan.
&lt;/h3&gt;



&lt;h3&gt;
  
  
  Authors
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://github.com/aliahsan07"&gt;Ali Ahsan&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://github.com/abreezasaleem"&gt;Abreeza Saleem&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;h2&gt;
  
  
  The actual Idea
&lt;/h2&gt;



&lt;p&gt;Initially, the scope of the project was broader and rather ambitious. We wanted to build an application that essentially synchronizes the relief operations on a city level in Pakistan such that the charities divide the regions(of a city/district) amongst themselves and only distribute ration there. Our portal would show where each charity/NGO operated. What this would have meant is a more efficient and egalitarian solution to the food crisis problem.&lt;/p&gt;

&lt;p&gt;But this turned out to be a difficult task mainly due to two reasons:
&lt;br&gt;
1) The complexity of the task: Ensuring such synchronicity and collaboration would mean operating from the ground, communication with relevant authorities: charities, local governments, public perhaps. It was simply not feasible, so we had to limit our scope.
&lt;br&gt;
2) The lack of time on our hands: We couldn't invest as much time as we would have liked and had to constrict the scope of the project. &lt;/p&gt;


&lt;h2&gt;
  
  
  What we actually built
&lt;/h2&gt;

&lt;p&gt;Covid Relief Pakistan is a web portal that gives the user an option to select a city from the dropdown and view charities operating there. This would show a list of exclusive charities working in that city as well as those working nationwide. If the user is interested in more details about the charity/NGO, they have the option to subscribe for more details. This is where the Twillio SMS API comes in. Once the user provides us their phone number, we send them relevant details about the selected charity.&lt;br&gt;
&lt;br&gt;&lt;br&gt;
A sample message is as follows:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Charity Name: Shahid Afridi Foundation
website: https://shahidafridifoundation.org/donatekarona/
Contact Number: Not Provided
EasyPaisa: Not Provided
Bank Details are as follows
Account Title: Shahid Afridi Foundation
Bank Name: Habib Bank Limited
Account Number: ----------
IBAN: ----------------
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;Users can also contribute by filling out a Google form that can be accessed by clicking the Add Charity Button. We are manually vetting the data that we get from the form to ensure authenticity. &lt;/p&gt;



&lt;h3&gt;
  
  
  Link to Demo
&lt;/h3&gt;

&lt;p&gt;The project is deployed on heroku: &lt;br&gt;
&lt;a href="https://pacific-headland-81140.herokuapp.com"&gt;Demo&lt;/a&gt;&lt;br&gt;
&lt;br&gt;&lt;br&gt;
&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--1RVKHXog--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/s9k7uwwuyyl4vw0whbmy.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--1RVKHXog--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/i/s9k7uwwuyyl4vw0whbmy.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;br&gt;
&lt;/p&gt;

&lt;h3&gt;
  
  
  Link to Code
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://github.com/AbreezaSaleem/Covid-Relief"&gt;Github Repository&lt;/a&gt;&lt;/p&gt;





&lt;h2&gt;
  
  
  Tech Stack
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Frontend
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;React (create-react-app)&lt;/li&gt;
&lt;li&gt;Google Maps React&lt;/li&gt;
&lt;li&gt;Downshift&lt;/li&gt;
&lt;li&gt;SCSS&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Backend
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Node &lt;/li&gt;
&lt;li&gt;Express&lt;/li&gt;
&lt;li&gt;Twillio API&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Other Technologies
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;GitHub for Repository Management&lt;/li&gt;
&lt;li&gt;Heroku for deployment&lt;/li&gt;
&lt;li&gt;Notion for Project Management&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Discoveries/Reflections from Project
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Experimented with downshift for the first time. A convenient library to build dropdowns and store state. &lt;/li&gt;
&lt;li&gt;Had issues integrating WhatsApp API, so stuck with the messaging Twillio API only. Twillio has done an amazing job in maintaining and documenting their APIs, their starter codes are beneficial, and if you play along enough, you realize you can achieve a lot with them (that's the intention). 

That's our submission to the Twillio API hackathon, a nice and simple node app with React frontend. All the best, everyone!&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>twiliohackathon</category>
      <category>javascript</category>
      <category>react</category>
      <category>node</category>
    </item>
  </channel>
</rss>
