DEV Community: Netanel Basal

🚀 The Ultimate Monorepo Starter for Node.js Serverless Applications

Netanel Basal — Wed, 11 May 2022 05:16:56 +0000

I am happy to announce the release of "The Ultimate Monorepo Starter for Node.js Serverless Applications."

Features

✅ First-Class Typescript Support
✅ DynamoDB Single Table Design
✅ Shared API Gateway
✅ Environments Configuration
✅ JWT Auth Middleware
✅ Http Params Validation
✅ Typed Proxy Handlers
✅ Auto Generators
✅ Localstack
✅ ESLint
✅ Jest

https://github.com/ngneat/nx-serverless

🚀 Introducing Transloco: Angular Internationalization Done Right

Netanel Basal — Mon, 19 Aug 2019 05:35:42 +0000

Originally published at netbasal.com

For a while I've been thinking about creating an Angular i18n library, which incorporates some concepts I had in mind.

A couple of weeks ago I was bored 😀, so I decided that's it time to take the bull by the horns and go ahead and create a robust library, chock-full of all the features I'd expect from such a library.

I recruited Shahar Kazaz and Itay Oded to the task; Together, we worked hard over the weeknights, and that's how Transloco was born.

I've also created the ng-neat organization, to hold all my open source libraries. Currently it only holds Transloco, but I also plan to transfer Spectator, ngx-until-destroy, ngx-content-loader, and any future open-source Angular libraries I create.

Let's take a look at what Transloco has to offer.

Install the library using Angular CLI:

ng add @ngneat/transloco

As part of the installation process you'll be presented with questions; Once you answer them, everything you need will automatically be created for you. Let's take a closer look at the generated files.

First, Transloco creates boilerplate files for the requested translations:

assets/i18n/en.json

{
  "hello": "transloco en",
  "dynamic": "transloco {{value}}"
}

assets/i18n/es.json

{
  "hello": "transloco es",
  "dynamic": "transloco {{value}}"
}

Next, it injects the TranslocoModule into the AppModule, and sets some default options for you:

import { TRANSLOCO_CONFIG, TranslocoModule } from '@ngneat/transloco';
import { HttpClientModule } from '@angular/common/http';
import { httpLoader } from './loaders/http.loader';
import { environment } from '../environments/environment';

@NgModule({
  imports: [TranslocoModule, HttpClientModule],
  providers: [
    httpLoader
    {
      provide: TRANSLOCO_CONFIG,
      useValue: {
        prodMode: environment.production,
        listenToLangChange: true,
        defaultLang: 'en'
      }
    }
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}

Let's explain each one of the config options:

listenToLangChange: Subscribes to the language change event, and allows you to change the active language. This is not needed in applications that don't allow the user to change the language in runtime (i.e., from a dropdown), so by setting it to false in these cases, you can save on memory by rendering the view once, and unsubscribing from the language changes event (defaults to false)
defaultLang: Sets the default language
fallbackLang: Sets the default language/s to use as a fallback
failedRetries: How many time should Transloco retry to load translation files, in case of a load failure (defaults to 2)

It also injects the httpLoader into the AppModule providers:

import { HttpClient } from '@angular/common/http';
import { Translation, TRANSLOCO_LOADER, TranslocoLoader } from '@ngneat/transloco';
import { Injectable } from '@angular/core';

@Injectable({ providedIn: 'root' })
export class HttpLoader implements TranslocoLoader {
  constructor(private http: HttpClient) {}

  getTranslation(langPath: string) {
    return this.http.get<Translation>(`/assets/i18n/${langPath}.json`);
  }
}

export const httpLoader = { provide: TRANSLOCO_LOADER, useClass: HttpLoader };

The HttpLoader is a class that implements the TranslocoLoader interface. It's responsible for instructing transloco how to load the translation files. It uses Angular HTTP client to fetch the files, based on the given path.

Translation in the Template

Transloco provides three ways to translate your templates:

Using the Structural Directive

This is the recommended approach. It's DRY and efficient, as it creates one subscription per template:

<ng-container *transloco="let t">
  <ul>
    <li>{{ t.home }}</li>
    <li>{{ t.alert | translocoParams: { value: dynamic } }}</li>
  </ul>
</ng-container>

Using the Attribute Directive

<ul>
  <li><span transloco="home"></span></li>
  <li>
    <span transloco="alert" [translocoParams]="{ value: dynamic }"></span>
  </li>
  <li><span [transloco]="key"></span></li>
</ul>

Using the Pipe

<span>{{ 'home' | transloco }}</span> 
<span>{{ 'alert' | transloco: { value: dynamic } }}</span>

Programmatical Translation

Sometimes you may need to translate a key in a component or a service. To do so, you can inject the TranslocoService and use its translate method:

export class AppComponent {
  constructor(private service: TranslocoService) {}

  ngOnInit() {
    this.service.translate('hello');
    this.service.translate('hello', { value: 'world' });
    this.service.translate(['hello', 'key']);
    this.service.translate('hello', params, 'en');
    this.service.translate<T>(translate => translate.someKey);
  }
}

😱 But Wait - There's More!

This was just a taste of Transloco, it also supports:

😴 Lazy Loading
😍 Multiple Languages
🔥 Multiple Fallbacks
🤓 Testing
🦊 Fully customizable

You can find everything you need, along with examples, in our official README file.

Migration from ngx-translate

Transloco provides a schematics command that will help you with the migration process. Check out the comparison table for more information.

Happy translating, and don't forget to show your appreciation by starring!

⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️⭐️

Start Writing About Code: The Why and How

Netanel Basal — Wed, 12 Jun 2019 09:47:16 +0000

This article was originally published in netbasal.com.

In over three years of writing, and having written over 120 articles, I have decided to share with you some tips I have learned along the way to help those who wish to start writing or are already in the process of writing.

Before we begin, I would like to point out some reasons why one should start writing in the first place.

🤔 Why You Should Start a Blog

The first reason being that one of the things that cause developers satisfaction, is knowing that the information they share has helped someone else.

A second reason is that writing an article requires a deep understanding of its content, so in the process of doing so, we become more professional.

The third reason is that my articles are my reference whenever I need to develop a new feature or solve a bug whenever I've forgotten how to do so.

The last reason is the ability to create a name for yourself in the community, which is a nice thing in and of itself.

Hopefully, by now you're convinced you should start writing, so allow me to give you some tips:

✌️Don't Give Up

One of the common responses I get from people who start writing is "I only had 20 views", or "I only got one like."

Let me tell you something: It took me three years of writing to get to where I am today. If you do not keep moving forward and creating useful materials, it will stay that way. You mustn't give up.

📤 Share Your Articles

In order to get to know you, especially at the beginning of your journey, it's important to publish the articles you create wherever possible.

Share them on Facebook groups, LinkedIn, Twitter, or any other relevant place. If you don't do that, the chances of readers being introduced to them are very slim. Once you have enough followers, you can skip this part.

👮 Choose Your Content Wisely

A crucial decision to make is what your articles should be about. The articles that get the most views are those that solve a problem for a large number of people. Try to offer unique content to the reader, and avoid writing about obvious things.

🤓 Select a Good Title

The article title is one of the most important decisions you'll make, for two reasons: First, a good headline attracts more readers; Second, a good headline will show up in many relevant search results.

Always think about what the reader would write in the search input, and build the title based on that. Your article's exposure will be much more significant if it's on the first page of Google search results.

😟 "But English Isn't My Native Language"

Unfortunately, there are a lot of very talented people who want to share their knowledge but are deterred from doing so, because English is not their native language.

But at the end of the day, we all speak one language: code. Even if you're not the most articulate English speaker, don't be shy, just write. If the title is good and the code is interesting, people will understand. So don't worry too much about it.

Personally, I have often encountered technical articles written in various languages, such as Russian or Chinese. I saw an interesting title, ran Google translate, and learned a few things from them.

Furthermore, these days you can get online proofreading services for a small amount of money. So the bottom line is, do not let that deter you. The more you write, the better your English will become.

💪 Improve Your Writing Skills

Learn from others: The only way to get better at writing is to read other people's technical books and articles. Pay attention to their methods, opening sentences, and styles of writing. Then see how your writing can improve as a result.

👂 Get Feedback

Ask for feedback from as many of your co-workers and colleagues as possible. I'm sure you understand what you've written, but that doesn't necessarily mean it's evident to others.

😞 ״But Someone's Already Written About It״

If someone has already written about a particular subject, that doesn't mean you shouldn't write about it either. There is a chance that readers will benefit from your explanation and examples.

✋ Ignore Rude Comments

Along the way, people will comment on your articles. Some of those responses might be rude; My advice is simply to ignore them, and not to take them personally.

✍️ Tips for Writing:

Keep it simple. Try to avoid complicated phrases. People love to read clear and concise language. Most importantly, be yourself.
It's better to write one long article than divide it into several parts. The reader can stop at any point and get back to it, so you don't have anything to worry about.
Try to have a fair amount of code and text - I encounter many articles that have lots of text but very little code, or vice versa. In many cases, it discourages the readers and they abandon the article.
Create a proper division into paragraphs, add punctuation marks and periods where necessary.
Using emojis is always lovely and valuable 🦄
When possible, before you go into the technical parts, show the readers an illustrated example of what you're going to create. Use an image, gif, or any other means. There's a chance that this is what will attract readers and keep them reading on.
When you add a code section to an article, make sure it's nicely formatted.
Don't add code blocks as images. It is very annoying and prevents people from being able to copy the code.
Try to add the final result at the end of the article, whether it's via a Github repo or something like Stackblitz.

Hope these tips helped inspire you… now go write 😎