Tag: Tutorial

Git: GitHub & SSH Keys Setup

I have generated an SSH key a number of times, either at work or on my personal PC for a number of accounts. Now that I am using my Surface Book 2 as my primary development device until I get a new SSD for my desktop PC, I thought that it might be worthwhile documenting how to generate an SSH key and add it to a GitHub account.

Now if you already have an existing SSH key then you can go ahead and use that but if you have never generated an SSH key before or you may have forgotten how to then hopefully you will find this guide useful.

Assumptions/Pre-Requisites

  1. You already have Git installed on your device.
  2. You will be using GitHub for your repositories.
  3. You are using a Windows environment.

Step 1 – Create a new SSH Key

Do not proceed with this step until you have the pre-requites met otherwise this guide will not work for you unfortunately.

  1. Open your Git Bash Terminal.
  2. Execute the following command replacing <github email address> with the email address you use for your GitHub account: 
    ssh-keygen -t rsa -b 4096 -C <github email address>

    The parameters used in the above command are:
    -t rsa – the type of key to create. In this case an RSA Key.
    -b 4096 – the number of bits in the key.
    -C <github email address> – a comment or label for the key.
    For more information about the parameters that can be used click here.

  3. You will be prompted to provide a file location where to save the SSH Key. Press Enter. This will save the file in the default location. Using the default location is recommended in this case.
  4. You will be prompted to enter a secure passphrase. If you choose to provide a secure passphrase then it will secure your SSH Key, this is a recommended step.

Your SSH key should now be generated 🙂

Step 2 – Adding your new SSH Key to the ssh-agent

If you have successfully performed the step “Step 1 – Create a new SSH Key” or you already have an SSH key that you want to use then you can proceed with the following step.

  1. Open your Git Bash Terminal (if you have closed it).
  2. Execute the following command: 
    eval $(ssh-agent -s)

    This will start the ssh-agent in the background.

  3. Execute the following command: 
    ssh-add ~/.ssh/id_rsa

    Note: If your key is not in the file named “id_rsa” or is not in the same location then you will need to replace the value id_rsa in the command with the name of the private key file and/or the location of where the file is store. The above example is for the default name and location.

Step 3 – Adding your SSH Key to your GitHub Account

The hard work is now all done. The next part is super easy even though there are more steps.

  1. Open your Gut Bash Terminal (if you have closed it).
  2. Execute the following command: 
    clip < ~/.ssh/id_rsa.pub

    This will copy the content of your public key file ready to be pasted into GitHub. It is important to not add or remove any spaces or newlines to the content.

  3. Log into GitHub.
  4. Navigate to the “Settings” page.
  5. Under “Personal Settings” select “SSH and GPG keys”.
  6. Click “New SSH key”.
  7. Add a Title to your key. In this case for me it was generated from my Surface Book 2 so I made sure that it was referenced in the Title.
  8. Paste your key in the “Key” field.
  9. Click “Add SSH key”.

You should now see a new SSH Key added to your GitHub profile.

For more information generating your SSH Key, adding your SSH Key to your GitHub account, and other SSH connection information take a look at the GitHub Help Page. I have tried to simplify the process by combining the information that was scattered across two to three pages from the GitHub Help Pages into one page. The GitHub team have done a fantastic job in documenting the entire process however and the above link should be used if my steps are not sufficient or confusing in any way.

UWP: Localized String UI XAML Properties

I was messing around in Visual Studio today and decided to spruce up my UWP apps a little bit. Originally what I was doing for all my string UI XAML properties on every project was hard coding them in the XAML code like this:

<PivotItem Header="Item 1">
    ...
</PivotItem>
<PivotItem Header="Item 2">
 ...
</PivotItem>

However there are several major flaws with this:

  1. Your strings are hard coded in the XAML code and if you were to make any modifications it would need to be done programmatically which could get messy.
  2. There is no consideration for other languages other than the one you have hard coded; a big oversight if you plan on releasing your app worldwide.
  3. It is not very flexible and easy to manage; if you need to change your strings it would have be done across a number of XAML files and it could take a long time to change everything.

Nearly every tutorial or blog post when they are writing string UI XAML properties they  always do this ‘hard coded’ method. Even Microsoft does this on their official page when outlining the different Controls and Patterns, see the Tabs and Pivot example here. Really though, I don’t blame them as it is really simple and gets the picture across nicely for beginners and the focus is really on the Controls and Patterns. However if you are going to be making a commercially viable product that will be used across different continents, supporting a number of languages is critical.

Eventually to solve this problem you have to do some Googling or Binging (not sure if that is the Bing equivalent), or if you use the new extension/tool called the ‘Windows Template Studio’ to help build your new app it sets everything up nicely for you. This is all well and good if you use the extension/tool but if you are not, then Microsoft again has a convenient page to look at, see here. I used this page to solve this very same problem and it should help you as well.

The solution to this problem can be broken down into several steps:

  1. Set a Default Language on your Package.appxmanifest (outlined in red).
    Package.appxmanifest Default Language Setting
  2. Create a ‘Strings’ folder in your root project solution.
  3. Create a subfolder that matched the Default Language you have set.
  4. Create a Resources.resw file under the subfolder.
    Default Language Strings Folder Structure
  5. Add all your string UI XAML properties in the Resources.resw file where:
    1. Name: The XAML property you are referencing including the XAML object.
    2. Value: The value for the XAML property, what you want shown.
    3. Comment: A simple comment to help identify and describe what the property and value is for.

The Microsoft page listed above outlines a very simple example and how to test your application, so I am not going to go into further detail here and I suggest you look at their example and testing method. If you are starting out doing some UWP app development then you might not be aware of what the best practices are (I still don’t), so hopefully you find this information useful and you can create commercial grade UWP apps for the Microsoft Store.

%d bloggers like this: