Skip to main content

10 posts tagged with "javascript"

View All Tags

· One min read

Today, I tackled the creation of a new NextJS form for my application, opting for a sleek horizontal arrangement of components. Striving for a 100% width within the parent container proved trickier than expected. Copilot came to the rescue, aiding with the necessary math to resize the components accurately.

Catch a glimpse of the journey in this brief video:

Yet again, GitHub Copilot proves to be the hero of my coding journey – making my day, one efficient line of code at a time!

· One min read

In my Next.js project, I encountered a challenge while working on a form that involved managing a list of values. Being a beginner, I found myself unsure about the logic required to extract the selected value from the list and update the state of the component.

Fortunately, as I delved into coding, GitHub Copilot came to my aid with a suggested code snippet:

if (field === "brand.id") {
let brand = brands.find(brand => brand.id === value);
setBoard({
...board,
brand: brand
});
return;
}

Experience the efficiency and precision of Copilot in action by watching the video demonstration below:

Yet again, GitHub Copilot proves to be the hero of my coding journey – making my day, one efficient line of code at a time!

· One min read

When working with NextJS and Typescript, I often find myself creating classes to represent data structures. In the course of doing so, I often need to create the class from a REST API response that is a JSON object.

To expedite this crucial task, I turned to GitHub Copilot for assistance. Witness the efficiency and precision of Copilot in action by watching the following video:

Yet again, GitHub Copilot proves to be the hero of my coding journey – making my day, one efficient line of code at a time!

· One min read

In the course of developing using NextJS, the integration of internationalization became a pivotal requirement on my checklist. The aim was to enable seamless translation of the application into multiple languages, leveraging the native i18n features provided by NextJS, as outlined in the official documentation.

To facilitate this, I organized a set of JSON files, each containing translations for the application in a specific language. For simplicity, I adopted a one-file-per-language approach, ensuring uniformity by maintaining identical keys across all files. The translation process involves replacing the values associated with each key.

To expedite this crucial task, I turned to GitHub Copilot for assistance. Witness the efficiency and precision of Copilot in action by watching the following video:

Yet again, GitHub Copilot proves to be the hero of my coding journey – making my day, one efficient line of code at a time!

PS: In this video I am translating the full file, but you can also translate a single key, or a set of keys, as you type them in the IDE, GitHub Copilot completion will propose you the translation.

· One min read

In the process of constructing a product catalog within NextJS, I found myself in need of seamlessly interfacing with my backend using REST APIs, each adorned with a variety of URIs and parameters.

The typical structure of these URLs, such as /api/v1/products?category=shoes&color=red&size=10, prompted me to harness the power of GitHub Copilot to expedite the creation of functions with the appropriate parameters. Copilot not only assists in generating the function but also crafts the necessary fetch code for calling the API with precision.

Watch this video to witness the rapid development in action:

Yet again, GitHub Copilot proves to be the hero of my coding journey – making my day, one efficient line of code at a time!

· One min read

A long-awaited feature is now available on GitHub: share actions in your workflows in your enterprise from Internal Repositories 🤖 !

When a developer does not find a suitable GitHub Action in the Marketplace, they can create their own, something that I have documented in the "How to Write Custom GitHub Action" post.

Until today, Actions had to be stored in a public repository, to allow other repositories to use them in workflows (or take a complex approach). This has changed 🎉.

Now you can put your actions in an internal repository; repositories visible to your whole enterprise.

Once your repository visibility is set to "Internal", in the Settings pages, click in the Actions section and select the proper Access configuration:

GitHub Actions Access

The following video shows this feature in action:

· 5 min read

In the first blog post of this series, I have explained how to create a custom GitHub Action that is interesting when you do not find the action that you need on the GitHub Marketplace.

I will now focus on some interesting API that you can use when building an action: Checks & Annotations.

It is import, when a workflow is running to provide visual feedback to the user. This is where the checks and annotation API is handy as it allows you for example indicates to the user that a specific step has failed ( ❌ ) or was successfully ( ✅ ) executed; and using the API it is also possible to create a detailed annotation that points to a specific line of code; this helping the user to understand what is going on in the workflow.

The following screenshot shows the annotation API in action:

Workflow Annotations

📗 In this second post, you will learn how to:

  1. Create custom Checks
  2. Add some detailed annotation with reference to source code (lines) with error
  3. Deploy the action

If you prefer the video version of this post go to Github Actions: Create custom Checks and Annotations .

It is time now to dive into the example!

· 10 min read

Automation is a key element of modern software development and deployment. GitHub with GitHub Actions allows you to automate many tasks, starting with your continuous integration and continuous deployment... but GitHub Actions a lot more than a CI/CD, you can use it for provisioning your environments, automating some project management tasks. However, it is not the purpose of this post, where I want to focus on the development of your own Github Action!

An "Action" is the reusable component of a workflow, and when you create your automation you will start by searching the GitHub Marketplace to look for actions to achieve a specific task. In addition to the thousands of actions available on the marketplace, and available in open source communities, you can create your own actions.

This blog post will guide you using a concrete example, through the steps to create your actions, and this is just "my version" of the official Creating Actions documentation chapter.

Let's say for example that you want to enforce the fact that your repositories have always a README.md and a LICENSE file. And when the repository is not compliant with these rules the workflow should fail and provide clear information to the user.

The following screenshot shows messages and alerts raised by the actions during an integration workflow:

Workflow Checks

📕 In this first post, you will learn how to:

  1. Create an action
  2. Publish the action
  3. Use the action in a workflow
  4. Add some logic to control the workflow's success or failure.

📗 In a second post, you will learn how to:

  1. Create custom Checks
  2. Add some detailed annotation with reference to source code (lines) with error
  3. Deploy the action

If you prefer a video version of it, take a look to "Build Your Own Action" on YouTube.

It is time now to dive into the example!

· 2 min read

With all the Java Scripting language around (Groovy, Rhino, Ruby, Jython... and so on) it is always interesting to understand where this come from... but also be able to talk with people about it, especially when they do not understand why scripting is interesting...

Googling around looking for some information on scripting benefits for a presentation I found this very intersting article from John Ousterhout, (he wrote the article in 1998) but I am sure you will still appreciate it...

Scripting: Higher Level Programming for the 21st Century.

One of the most interesting part in this context is the paragraph 4:

A scripting language is not a replacement for a system programming language or vice versa. Each is suited to a different set of tasks. For gluing and system integration, applications can be developed 5-10x faster with a scripting language; system programming languages will require large amounts of boilerplate and conversion code to connect the pieces, whereas this can be done directly with a scripting language. For complex algorithms and data structures, the strong typing of a system programming language makes programs easier to manage. Where execution speed is key, a system programming language can often run 10-20x faster than a scripting language because it makes fewer run-time checks.

· One min read

This new Java World article compares the different Java scripting languages (Groovy, JudoScript, Pnuts, JRuby, Jacl, Jython, Rhino, and BeanShell), and list the issues that you have to select the good one...

In this article that I like I would like to read a little about the JSR-223 that should help with the integration part.

I will be very interested to know how you use Java Scripting language in your projects, so feel free to drop me a comment or mail ( tugdual at gmail)