Skip to main content

5 posts tagged with "typescript"

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!