W listopadzie opublikowałem 6 wpisów:

Inne:

• Laserowa korekcja wady wzroku
  
• Jak poprawić jakość swojej pracy? Spróbuj techniki pomodoro

JavaScript:

• JavaScript: Obsługa klawiatury

NodeJS:

• Podpięcie TypeScript w NodeJS
  
• Wykrycie automatycznej zmiany kodu w NodeJS

Wczoraj dodałem jeden nowy komiks: How does good habit work?

Przeczytałem pięć książek:

• You are your own gym the cookbok - Mark Lauren
  
• How to live - Derek Sivers
  
• Nomadland. W drodze za pracą - Jessica Bruder
  
• Smocze kły - Michael Crichton
  
• Wielka Magia - Elizabeth Gilbert

Przesłuchałem jeden audiobook:

• Finding Flow - Mihaly Csikszentmihalyi

Czym jest technika pomodoro?

Technika pomodoro służy do poprawy własnego skupienia. Skupiony pracujesz lepiej, ponieważ nie pozwalasz sobie na rozpraszanie. Swoje zadania wykonujesz szybciej.

Sam kiedyś miałem duży problem ze skupieniem. Często się rozpraszałem, a przez to więcej czasu musiałem poświęcić na pracę. Postanowiłem coś z tym zrobić.

Pomodoro to była pierwsza metoda, z jakiej skorzystałem, w celu poprawy własnego skupienia. I korzystam często z niej do dziś.

Jak to działa?

Mechanizm działania techniki pomodoro jest banalnie prosty:

1 Ustaw minutnik na 25 minut. Czas jest umowny, możesz ustawić mniej, ale minimum jak dla mnie to 15 minut.
2 Uruchom minutnik, niech odlicza czas. W tym momencie zaczynasz pracę nad zadaniem.
3 Kiedy czas minie możesz zapisać sobie, że zaliczyłeś jedną sesję pracy. 4 Jeśli tego potrzebujesz, zrób sobie przerwę maksymalnie: 5 minut.
5 Zacznij kolejną sesję: uruchom znowu minutnik.
6 Jeśli zaliczysz trzy sesje pracy, polecam zrobić sobie dłuższą przerwę: 15 - 20-minutową

Uwaga: Ta technika zadziała, ale pod jednym warunkiem! Musisz trzymać się zasady, że kiedy masz uruchomioną sesję pracy, to skupiasz się tylko na zadaniu, a nie że na minutę włączysz sobie YouTube'a.

Jeśli masz problem ze skupieniem możesz potraktować stosowanie techniki pomodoro jako trening na skupienie. W tej technice ważna jest regularność.

Są różne techniki na skupienie. Możesz na przykład poprawić swoje skupienie na pracy poprzez dźwięk. Napisałem wpisy na ten temat: tutaj i tu

We frontendzie automatyczne przekompilowanie kodu po jego zmianie to standard. Można to samo zrobić w NodeJS.

Podam dwie wersje dla "zwykłego" JavaScript i dla TypeScript.

Wersja dla JavaScript

Instalujemy nodemon

Nodemon to narzędzie, które zrestartuje Twoją aplikację napisaną pod NodeJS od razu gdy kod się zmieni.

Instalujemy:

npm i --save-dev nodemon

Konfiguracja

W pliku package.json w scripts podpinamy nodemon:

{
   ...
   "scripts": {
      "serve": "nodemon index.js"
   }
}

Wystarczy teraz tylko odpalić skrypt serve:

npm run serve

i zmienić kod, a skrypt sam się przełąduje (i oczywiście zapisać zmiany pliku!).

Wersja dla TypeScript

Jeśli nie podpinałeś TypeScript'a z NodeJS to tutaj dowiesz się jak to zrobić.

Wersja dla TypeScript jest bardzo podobna do poprzedniej:

Instalacja

Oprócz nodemon zainstalujemy także: concurrently. To narzędzie służy do uruchomienia kilku komend naraz. Po co to nam się dokładnie przyda, opiszę za chwilę.

npm i --save-dev concurrently nodemon

Konfiguracja

W pliku package.json w scripts podpinamy:

{
   ...
   "scripts": {
      "serve": "concurrently \"tsc --watch\" \"nodemon -q dist/index.js\""
   }
}

Pod serve wywołujemy dwa polecenia. Żeby, to zrobić posługujemy się concurrently. Składnia jest prosta po słowie: concurrently podajemy w nawiasach: "" dane polecenie, które chcemy wywołać. W tym przypadku jest, to: tsc --watch — będzie nasłuchiwać ewentualnych zmian, w kodzie TypeScript. A drugie polecenie po prostu zrestartuje skrypt, gdy zmiany w TypeScript zostaną przekompilowane do docelowego pliku JavaScript.

W tym wpisie zakładam, że masz już stworzony plik: package.json. Jeśli nie to wywołaj komendę:

npm init

Żeby dodać obsługę TypeScript, po stronie NodeJS wystarczy:

Zainstaluj TypeScript

Zainstaluj lokalnie TypeScript za pomocą:

npm i typescript

Wygeneruj plik tsconfig.json

Jak sama nazwa wskazuje plik tsconfig.json służy do przechowywania konfiguracji TypeScripta. O samej konfiguracji będzie za chwilę, ale najpierw stwórzmy sam plik.

Do stworzenia tego pliku użyjemy npx. Jeśli masz zainstalowany npm minimum w wersji 5.2.0 powinieneś mieć do tego dostęp.

Wywołujemy:

npx tsc --init

Otwórz plik tsconfig.json. Będzie tam wiele zakomentowanych linijek. Znajdź taką:

// "outDir": "./",

I zmień ją na:

"outDir": "dist",

Możesz wykasować wszystkie zakomentowane linijki. Powinieneś mięć coś takiego:

{
  "compilerOptions": {
    "target": "es5", 
    "module": "commonjs",  
    "outDir": "dist",
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "strict": true,
    "skipLibCheck": true
  }
}

Instalacja zależności

Żeby sprawdzić, czy to rzeczywiście działa zainstalujmy bibliotekę Express:

npm i express

Jeśli chcemy używać TypeScript, po stronie NodeJS będziemy potrzebować także definicji typów. Dla większości bibliotek te definicje są instalowane domyślnie z biblioteką, ale niektóre nie. Dlatego warto zainstalować brakujące.

Zainstalujmy te:

npm i @types/express @types/node

Uruchomienie

Zostało nam sprawdzenie, czy wszystko działa.

Zanim uruchomimy skrypt, edytujmy plik package.json i dodajmy do sekcji scripts taką zawartość:

"scripts": {
	"build": "tsc",
	"preserve": "npm run build",
	"serve": "node dist/index.js",
},

Skrypt build kiedy zostanie wywołany przekompiluje nam kod z postaci w wersji .ts na .js i umieści, w folderze dist.

Skrypt preserve jest zawsze wywoływany przed wywołaniem skryptu serve. Czyli skompiluje nam kod, ponieważ skryptu build sami jawnie nie wywołujemy.

Skrypt serve uruchomi nam już skompilowany kod.

Zaraz uruchomimy kod, ale najpierw musimy mieć, co uruchomić.

Stwórz plik o nazwie: index.ts i wrzuć taką zawartość:

import express from 'express';
const app = express();

app.listen(3000, () => console.log('Powered by NodeJS and TypeScript!'));

Mamy już wszystko!

Uruchom komendę:

npm run serve

Zauważ, że zostanie uruchomiona sekwencja skryptów, które definiowaliśmy wcześniej. Najpierw zostanie uruchomiony: preserve potem: build a na koniec: serve.