DEV Community: Fabien Townsend

Setup Node and NVM with Fish Shell

Fabien Townsend — Mon, 29 Jan 2024 19:12:58 +0000

Here is how to quickly install NVM with Fish Shell. I do assume here that you have fish shell installed and bew. If you don't have fish shell installed, you can follow my other tutorial here: TL;DR setup Fish Shell MacOS

1: Install nvm with brew

brew install nvm

2: Install bass for Fish Shell

omf install bass

3: Configure Fish shell

# ~/.config/fish/config.fish

...

function nvm
  bass source (brew --prefix nvm)/nvm.sh --no-use ';' nvm $argv
end

set -x NVM_DIR ~/.nvm
nvm use default --silent

And that's it, you are good to go, you can install node now:

nvm install --lts

Empowering Your Team with CLI Tools: A Quick Guide using Node.js

Fabien Townsend — Fri, 26 Jan 2024 09:38:24 +0000

In the dynamic landscape of technology, the ability to create Command-Line Interface (CLI) tools is a valuable skill that can significantly enhance your team's efficiency. CLI tools empower teams to streamline the execution of repetitive tasks, debug user issues by pulling relevant data, and monitor the health of systems, among other applications.

Getting Started with Node.js

Creating a CLI tool with Node.js is a straightforward process. Follow these quick steps to have a functional CLI tool up and running in no time:

Step 1: Set Up a New Project

Initiate a new Node.js project with the following commands:

npm init -y
npm config set type="module"

Step 2: Create Your Script File

Create an index.js file for your CLI tool:

touch index.js

Set the file as executable with the following shebang:

#!/usr/bin/env node

Make the file executable:

chmod +x index.js

Step 3: Update `package.json`

Add a "bin" entry to your package.json to specify the command associated with your CLI tool:

"bin": {
  "whatever-cmd": "./index.js"
}

Step 4: Create a Symbolic Link

Link your CLI tool globally using npm:

npm link

With these simple steps, you've created a basic structure for a Node.js CLI tool. Now, you can build upon this foundation by adding custom code to execute specific tasks. Whether it's automating routine processes, extracting data for debugging, or monitoring system health, your CLI tool is ready to empower your team's workflow.

Remember, the versatility of CLI tools extends beyond these examples, allowing you to tailor solutions to the unique needs of your tech environment. By mastering this skill, you contribute to the efficiency and effectiveness of your team's development processes. So, dive in, experiment, and witness the transformative impact of CLI tools in your tech arsenal.

Setup tmux on MacOS

Fabien Townsend — Tue, 05 Dec 2023 10:24:56 +0000

In a previous post, I discussed how I swiftly set up Fish Shell on my new MacOS.

Now, let's delve into the setup process for tmux.

Why tmux?

Tmux is crucial for maintaining my sanity while navigating between different projects. It allows me to have a distinct session for each project, and within each session, I can manage various windows to perform tasks such as:

Running the project
Executing tests
Opening another related project
And more

For installation, ensure that you have brew installed by running:



brew install tmux

To configure the minimal settings and make sure fish is used by default, create a tmux.conf file with the following commands:



$ touch ~/.tmux.conf
$ vim ~/.tmux.conf

Add the following line to the file:



set -g default-shell /opt/homebrew/bin/fish

If you're unsure about the fish path, type whereis fish.

Now, if you want new Terminals to use tmux by default, follow these steps:
Terminal > Settings... > Profiles > Startup

I messed up with AWD CDK, so you don't have to make the same mistake

Fabien Townsend — Sat, 02 Dec 2023 13:56:08 +0000

In my previous post, I discussed my choice of AWS CDK. As a newcomer to this solution, I followed various tutorials that provided basic solutions for quickly setting up different components. However, as I added more elements—multiple DynamoDB tables, several Lambdas, and a new public endpoint for the API Gateway—to a single file, I encountered two significant challenges:

Navigation became difficult.
There was an increased likelihood of merge conflicts when multiple people edited the same file.

Anticipating these issues, I knew that refactoring and isolating responsibilities would be necessary. However, dealing with infrastructure is not as straightforward as working with regular code.

When attempting to extract database creation code to a separate file, I faced unexpected challenges. With CDK, removing something from the code also removes it from the infrastructure. While this works seamlessly for stateless entities like Lambdas, it creates complications for resources like DynamoDB.

In the case of DynamoDB, moving code to another file results in:

Removal from the infrastructure, though the database remains intact in AWS; however, CDK considers it deleted.
Attempted recreation of the database, leading to an error stating that it already exists.

From:

export class ParentFile extends cdk.Stack {
  constructor(scope: Construct, id: string, props?: cdk.StackProps) {
    super(scope, id, props);

    ...

    const dynamodbTable = new dynamodb.TableV2(this, "AName", {
      tableName: "aName",
      partitionKey: { name: "sessionID", type: dynamodb.AttributeType.STRING },
      sortKey: { name: "timestamp", type: dynamodb.AttributeType.STRING },
    });

    ...
}

To:

export class ParentFile extends cdk.Stack {
  constructor(scope: Construct, id: string, props?: cdk.StackProps) {
    super(scope, id, props);

    ...

    const helloWithCounter = new AnotherFile(this, "HelloHitCounter", {});

    ...
}

export class AnotherFile extends cdk.Stack {
  constructor(scope: Construct, id: string, props?: cdk.StackProps) {
    super(scope, id, props);

    ... 

    const dynamodbTable = new dynamodb.TableV2(this, "AName", {
      tableName: "aName",
      partitionKey: { name: "sessionID", type: dynamodb.AttributeType.STRING },
      sortKey: { name: "timestamp", type: dynamodb.AttributeType.STRING },
    });

    ...
}

This leaves us in a situation where the database exists in AWS but not in CDK.

There are two alternative solutions:

Import the Database:
You can achieve this with code like dynamodb.TableV2.fromTableName(scope, id, "aName");. This limits you to read-only operations such as allowing to grant access to Lambdas but .
Import Existing AWS Resources to CDK:
Reference the DynamoDB creation code in the same way you initially created it and run cdk import. This approach reimports everything, giving you full control over the database.

The steps would be as follow:

Remove the reference to the dynamoDB (make sure that it retains the DB in AWS)
run cdk deploy
Add the reference you deleted to your new file
run cdk import

To summarize: avoid consolidating everything in a single file. If, like me, you hastily combined components, you can now refactor your CDK stack by performing a soft delete to keep resources in AWS while excluding them from AWS CDK. Subsequently, reimport them to regain full control.

Resource:
Find here an example step by step from AWS

TL;DR setup Fish Shell MacOS

Fabien Townsend — Mon, 27 Nov 2023 14:57:00 +0000

Here is TL;DR (too long; didn't read) summary of how to set Fish Shell on your MacOS to get that result:

Here are the commands that I used:


 bash
$ brew install fish
$ curl https://raw.githubusercontent.com/oh-my-fish/oh-my-fish/master/bin/install | fish
$ omf install bobthefish
$ set -g theme_nerd_fonts yes
$ brew tap homebrew/cask-fonts
$ brew install font-hack-nerd-font --cask

The next step will "fix" the font now being properly displayed:

Open your term2 profile:

Edit the font used:

Done.

Troubleshoot 1

I had an issue where bobthefish theme wouldn't work out, for that I followed the following steps:


 bash
functions fish_promp

And then delete the file it pointed out.

Remove omf and fish installation

I initially messed up with my installation, the following command enables me to clean up fish/omf to start from the beginning:


 bash
$ omf remove bobthefish
$ omf destroy
$ brew uninstall fish
$ rm -rf opt/homebrew/etc/fish

How to set and delete AWS CLI profile

Fabien Townsend — Thu, 23 Nov 2023 09:55:00 +0000

In this article, I will briefly explain how to add an AWS profile to your AWS CLI and how to delete it.

How to add a profile

AWS Console

From the top right of your screen, click on Security credentials

Then scroll down to the Access keys and click on Create access key

Then select Command Line Interface (cli), check the tick box, and click on Next

After that, you will be asked to Description tag value which is optional, on the following page you will be provided with the Access key and Secret access key required for configure your CLI.

Now we can pass to the CLI the required steps

CLI

You can start by typing the following command which will show you the current list of your AWS profile: aws configure list-profiles

You will now need to type the following command, where test is the name of the profile that you want
aws configure --profile test


 cli
AWS Access Key ID [None]: AKIA2INPZLWEZ2RAZ37Q
AWS Secret Access Key [None]: ****
Default region name [None]: eu-west-1
Default output format [None]:

Now if you type again aws configure list-profiles you will see you new profile.

How to delete a profile

AWS Console

From the Access keys section of the Security credentials page of your profile, you can click on Action > Delete and follow the steps described

Now you have deleted the profile from your AWS Console, you can follow the steps for your CLI

CLI

You have two files in your system credentials and config, you can find them in the following path for MacOS:


 cli
~/.aws/credentials
~/.aws/config

So in each of them, you will need to delete the related information to your profile which will be right below [test] where test is the name of your profile

Set up your authentication with Next.js and AWS Cognito

Fabien Townsend — Sun, 19 Nov 2023 12:25:37 +0000

In the realm of Next.js applications hosted on Vercel with an AWS infrastructure, establishing robust authentication becomes a pivotal task. After careful consideration of various options, including an in-house solution, Auth0, and Clerk, the decision was made to leverage AWS Cognito due to its seamless integration with AWS services.

The journey began with a glance at the existing in-house implementation, which fell short in handling advanced features such as email confirmation and password reset. While Auth0 and Clerk were considered, concerns about pricing and specific requirements like HIPAA compliance led to the selection of AWS Cognito.

Despite AWS Cognito's reputation for complex documentation, the benefits of integration with API Gateway and AppSync made it an attractive choice. The AWS CDK file presented below outlines the crucial steps in configuring AWS Cognito:

// *-stack.ts
    const userPool = new cognito.UserPool(this, "MyUserPool", {
      userPoolName: "my-next-auth-app-user-pool",
      selfSignUpEnabled: true,
      signInAliases: { email: true },
    });

    userPool.addDomain("MyUserPoolDomain", {
      cognitoDomain: {
        domainPrefix: "my-custom-domain-prefix",
      },
    });

    new cognito.UserPoolClient(
      this,
      "MyUserPoolClient",
      {
        userPool,
        userPoolClientName: "my-next-auth-app-client",
        authFlows: {
          userSrp: true,
          userPassword: true,
        },
      }
    );

For the front-end, the following configuration using AWS Amplify is recommended:

"use client";

import "@aws-amplify/ui-react/styles.css";
import { Amplify } from "aws-amplify";
import type { WithAuthenticatorProps } from "@aws-amplify/ui-react";
import { withAuthenticator } from "@aws-amplify/ui-react";

Amplify.configure({
  Auth: {
    Cognito: {
      userPoolId: "your user pool id",
      userPoolClientId: "your user pool client id",
      signUpVerificationMethod: "code",
      loginWith: {
        oauth: {
          domain:
            "you domain",
          scopes: [
            "phone",
            "email",
            "profile",
            "openid",
            "aws.cognito.signin.user.admin",
          ],
          redirectSignIn: ["http://localhost:3000/"],
          redirectSignOut: ["http://localhost:3000/"],
          responseType: "code", // or 'token', note that REFRESH token will only be generated when the responseType is code
        },
      },
    },
  },
});

const currentConfig = Amplify.getConfig();
Amplify.configure(currentConfig);
function App({ signOut, user }: WithAuthenticatorProps) {
  return (
    <>
      <h1>Hello {user?.username}</h1>
      <button onClick={signOut}>Sign out</button>
    </>
  );
}

export default withAuthenticator(App)

In conclusion, while this implementation serves as an illustrative example rather than a production-ready solution, it fills a void in resources for those seeking guidance on "AWS CDK + Next.js + Cognito." It's worth noting that the provided approach utilizes Amplify's configuration and UI for the login flow without relying on their CLI.

Why I picked AWS CDK?

Fabien Townsend — Thu, 16 Nov 2023 11:33:02 +0000

Title: Choosing AWS CDK for Infrastructure Improvement: A Practical Approach

Introduction

In this article, I'll detail the reasoning behind my choice of AWS CDK (Cloud Development Kit) based on a real-life scenario. Drawing from my extensive experience as a software consultant and product engineer for start-ups, I'll walk you through the decision-making process and share insights gained from working on projects with demanding automated testing requirements.

Identifying the Challenge

The challenge at hand involved a software system plagued by reliability issues. This system was hosted on an EC2 server and deployed manually through FTP, resulting in a user-experience problem where the server frequently lost user states, forcing a restart of user journeys from the beginning.

Approaching the Issue

My initial approach was twofold: comprehensively understand the problematic features and their expectations. Once I had a clear understanding, I considered two potential strategies:

Work with the existing legacy code and fix identified issues.
Reimplement the feature from scratch.

Choosing between these options was contingent on a case-by-case evaluation, with the understanding that "just rewriting it" shouldn't be the default solution.

Considering Solutions

When addressing problems, I habitually explore diverse solutions and weigh their trade-offs. This might involve:

Implementing a straightforward fix.
Implementing a temporary hotfix while planning a comprehensive solution.
Opting for a complete rewrite.

The Decision to Improve

In this particular case, with a tight deadline for the fix and an opportunity to enhance the team's workflow, I chose not only to address the issue by rewriting the code but also to improve infrastructure and deployment processes.

Choosing AWS CDK

Considering various tools like AWS CloudFormation, Terraform, Serverless framework, and AWS CDK, I opted for AWS CDK. This decision was influenced by my limited experience with AWS CloudFormation and Terraform, as well as the consideration that their learning curves might not align with the team's proficiency. Comparing Serverless and AWS CDK, I leaned towards AWS CDK due to its flexibility and the fact that our infrastructure was entirely on AWS.

Key Factors for Choosing AWS CDK

Familiarity with AWS infrastructure.
Flexibility required for the project.
Quick decision-making, prioritizing agility over extensive research.
Positive experiences with ChatGPT-generated insights for implementation.

Implementation and Results

Deploying and testing AWS Lambda + AWS API Gateway with the refactored functionality proved successful in addressing the reliability issue. The outcome includes:

Migration of one service from an EC2 server to a Lambda function.
Enhanced understanding of the service.
Streamlined code updates and deployments through the CLI.

Conclusion

AWS CDK has proven to be an impressive tool, facilitating swift infrastructure deployment and code updates. Its user-friendly approach aligns well with our need to move rapidly and adapt to evolving requirements. The decision-making process, though expedited, remains open to future adjustments, recognizing the potential for evolving needs and associated costs.

DEV Community: Fabien Townsend

Setup Node and NVM with Fish Shell

Empowering Your Team with CLI Tools: A Quick Guide using Node.js

Getting Started with Node.js

Step 1: Set Up a New Project

Step 2: Create Your Script File

Step 3: Update package.json

Step 4: Create a Symbolic Link

Setup tmux on MacOS

Why tmux?

I messed up with AWD CDK, so you don't have to make the same mistake

TL;DR setup Fish Shell MacOS

Troubleshoot 1

Remove omf and fish installation

How to set and delete AWS CLI profile

How to add a profile

AWS Console

CLI

How to delete a profile

AWS Console

CLI

Set up your authentication with Next.js and AWS Cognito

Why I picked AWS CDK?

Step 3: Update `package.json`