skip to Main Content
String Enums W TypeScript

String enums w TypeScript

Jak typ danych może wyrazić dokładnie 1000 słów? enum String.

String może zawierać wszystkie słowa świata. Kiedy chcemy ograniczyć się tylko do kilku w TypeScirpt mogliśmy wykorzystać union types

Teraz (od wersji 2.4 – która powinna się wyjść lada dzień) mamy do dyspozycji możliwość tworzenia typów wyliczeniowych, które jako wartość mogą przyjmować łańcuchy znaków.
Czytaj resztę...
WPF I MEF – Sterowanie Wyglądem Aplikacji W Zależności Od Posiadanych Zasobów.

WPF i MEF – sterowanie wyglądem aplikacji w zależności od posiadanych zasobów.

Jednym z fundamentów WPF’a są zasoby – Resources. Definiowane w ResourceDictionary czyli słowniku zasobów. Każdy element słownika posiada swój klucz, który używamy do pobrania zasobu „z bazy”.

Odwołanie do zasobu może odbyć się na dwa sposoby.

  • StaticResource – Wartość jest ustalona podczas załadowania XAML.
  • DynamicResource – Wartość jest ustalona w momencie, kiedy obiekt ma się pojawić.

To zachowanie DynamicResource możemy wykorzystać do wprowadzenia ciekawych rozwiązań.

Jeżeli DynamicResource odwołuje się do zasobu aplikacji, to może być on przykryty przez inny zasób o tej samej nazwie.

Jeżeli mamy kilku klientów, a każdy z nich chce innych kolorów w swojej aplikacji, możemy załatwić tą prośbę dołączając do binarek .dll z zasobami, które zmienią kolory w odpowiednich miejscach.

Przykładowa aplikacja ma na celu wyświetlać dwukolorową flagę.

polish_flag

Aplikacja zawiera swoje zasoby zdefiniowane w osobnej .DLL o nazwach MainResources (podstawowe zasoby aplikacji), ClientResources (zasoby zmienione na danego klienta).

Czytaj resztę...
Tymczasowe Sprawdzanie Typów W Kodzie JavaScript Dzięki Visual Studio Code Oraz TypeScript

Tymczasowe sprawdzanie typów w kodzie JavaScript dzięki Visual Studio Code oraz TypeScript

Programistyczny edytor Visual Studio Code, jest napisany w TypeScript, co więcej każda nowa wersja Visual Studio Code przychodzi razem z nową wersją kompilatora TypeScript. Tak się składa, że oba produkty Microsoftu są ze sobą dobrze powiązane.

Ostania aktualizacja Visual Studio Code w wersji 1.12 (kwiecień 2017), przychodzi z kompilatorem TypeScript 2.3. Ta wersja otrzymała możliwość sprawdzania typów w kodzie JavaScript poprzez przełącznik --checkJs.

Możesz sprawdzić poprawność typów w kodzie JavaScript tymczasowo. Jeżeli dodasz na początku pliku .js komentarz // @ts-check, wtedy kompilator TypeScript przejdzie po typach i podkreśli na czerwono błędy.

Czytaj resztę...
TypeScript 2.3 – Generatory

TypeScript 2.3 – Generatory

W TypeScript 2.3, który pojawi się w maju. Jedną z nowych możliwości, dostępnych w języku, będzie możliwość korzystania z generatorów.

TypeScript goni z zmianami w pojawiającymi się JavaScript. Jak TypeScript goni za zmianami to ja też muszę.

Generator to funkcja, która potrafi zwracać wiele wartości. Potrafi uwaga, uwaga generować je, na przykład na podstawie poprzednich wartości.

Klasycznie jak funkcja coś zwraca to funkcja razem z zwróconą wartością kończy swój żywot. W przypadku generatorów one giną, gdy:

  • Wykonywanie kodu dojdzie do klamry zamykającą funkcję
  • Generator wyrzuci wyjątek
  • Generator zostanie przerwany

Kod:

Czytaj resztę...
Zapisywanie Ustawień W Przeglądarce; Fasada Dla LocalStorage Lub SessionStorage

Zapisywanie ustawień w przeglądarce; fasada dla localStorage lub sessionStorage

Moja gra The Ship Game nie wymaga back-endu w postaci serwera bazą danych. Jak zapisać dane bez bazy danych? Można postawić na to co daje nam współczesna przeglądarka i jej JavaScriptowe obiekty localStorage oraz sessionStorage.

Gdy popatrzymy na interfejs obiektów typu Storage, czyli localStorage i sessionStorage to on wygląda on następująco.

Notacja z typami według TypeScriptu

  • length: number – właściwość tylko do odczytu. Zwraca ilość danych przechowywanych w Storage.
  • clear(): void – czyści cały Storage z danych.
  • key(index: number): string – Zwraca i-ty klucz z Storage.
  • getItem(keyName: string): string – Wyciąga wartość pod kluczem keyName.
  • setItem(keyName: string, keyValue: string): void – Zapisuje wartość keyValue pod kluczem keyName.

Fajny interfejs do zapisywania stringów do bazy. A co z obiektami? Jakbym chciał zapisać takie coś:

Czytaj resztę...
TsLint – Utrzymywanie Kodu W Jednym Stylu I Zapobieganie Bólowi Głowy

TsLint – utrzymywanie kodu w jednym stylu i zapobieganie bólowi głowy

TsLint to TypeScriptowa wersja JsLinta…

Linty to programy które sprawdzają twój kod pod względem:

  • Czytelności
  • Łatwość utrzymania
  • Błędy funkcjonalne

TsLint w projekcie TheShipGame jest uruchamiany przez WebPacka:

test oznacza, że jest dopasowany do rozszerzeń .ts oraz .tsx. .ts to rozszerzenie standardowe dla TypeScript, natomiast .tsx oznacza podobnie do .jsx pliki korzystające z rozszerzonej składni używanej np. przez bibliotekę React.

Czytaj resztę...
Jak Być Na Bieżąco Z Zależnościami W środowisku Node.js

Jak być na bieżąco z zależnościami w środowisku Node.js

Ilość zależności w projekcie The Ship Game wynosi 51 różnych wpisów w pliku package.json. Trzeba pamiętać że każdy z tych zależności posiada, także swoje – tworząc ‚niekończące’ się drzewo zależności.

Jak żyć?

Z pomocą przychodzi npm-check-updates. Instalacja wygląda tak:

A użycie nie może być prostsze. Komenda ncu poszuka pliku package.json i zwróci możliwe pakiety do aktualizacji. Przed kontynuacją z tematem tego posta trzeba wyjaśnić jak zapisywana jest wersja w środowisku Node.js oraz jak działają zakresy wersji.

Czytaj resztę...
The Ship Game – (pixel) Grafika

The Ship Game – (pixel) Grafika

Gry składają się z trzech filarów: grafika, dźwięk oraz rozgrywka.

W tym poście poruszę temat pierwszy grafikę.

Zdolności plastycznych nie mam, a grafika w grze musi być.

Postawiłem na jedyny styl używany w grach który:

  • Rozumiem
  • Mogę go samodzielnie tworzyć
  • Wygląda jako-tako

Jak tworzyć taką grafikę?

Można użyć edytorów graficznych takich jak:

  • Gimp
  • Paint.net
  • Photoshop

Ale żaden z nich nie został stworzony z myślą o pixel artcie. Jednym z takich edytorów jest Aseprite.

Czytaj resztę...
Back To Top