Od Zera do Dockera: ASP.NET Core

Tym razem, zamiast dzielić się “lifestylowymi” i projektowymi newsami, zacznę cykl “koderski”.
Jak wcześniej wspominałem, stworzyłem open sourcową pogodynkę, którą można znaleźć pod domeną http://czyjebnie.pl .
Żeby nie przedłużać: Miłej zabawy!

Wstęp

Do zabawy z dockerami zmotywowały mnie warsztaty Michała Franca (link) oraz blog Piotra Gankiewicza (link), który pomógł mi w poprawnym deploymencie oraz konfiguracji serwera. W 1. części kursu zajmę się stroną ASP.NET Core 2.0, a w drugiej zagadnieniem samego docker’a.
Czemu Docker? Dla sportu. Mogłem użyć normalnego deploymentu, jak w przypadku http://lifelike.pl , ale chciałem sprawdzić jak to działa w praktyce. Poza tym, jeszcze można sporo rozwinąć i podzielić logikę na parę mikroserwisów.

ASP.NET Core

Dlaczego ASP.NET Core? Bo nie przepadam za JS w tym Node.js, Ruby’m, a co najgorsze php, pewnie wielu odradzi, ale wciąż wolę starego dobrego Razor’a. W czyjebnie.pl oprę się jednak na webapi. Strona jest statyczna, a do poglądu API użyłem Swagger’a.
Zatem zacznijmy od pobrania runtime i sdk do .Net Core ze strony: https://www.microsoft.com/net/download/core#/runtime. W chwili pisania, jest to wersja 2.0. Osobiście, z racji poręczności instaluję wersję pod MacOS, ale jeśli używasz innego systemu, dobierz pod siebie … tzn. swój system. 🙂

Pierwszy projekt

Tu z pomocą i ułatwieniem przyszły template’y, które udostępnił MS  (https://github.com/dotnet/templating/wiki/Available-templates-for-dotnet-new) oraz w przypadku mikroserwisów, event busów itp. pomocny był template od wspomniany wcześniej Michała (link do jego template).
W przypadku tego projektu, użyłem template’u zwanego ASP.NET Core Web API.

Aby utworzyć projekt wystarczy użyć komendy w terminalu:

[code]
dotnet new webapi -n nazwaprojektu -o scieżkaprojektu
[/code]

Omówienie projektu

Teraz przejdźmy do omówienia stworzonego przez nas projektu, opiszę to na przykładzie wcześniej stworzonego projektu:

Drzewo projektu

Tu mała ciekawostka, do tej pory Nuget (repozytorium bibliotek) przyzwyczaiło nas, że wszystkie paczki znajdują się w odpowiednim pliku, który był tylko listą paczek package.config. Nie ukrywam, brakuje mi tego pliku 🙂
Tutaj, wszystkie paczki dodajemy w pliku projektu w grupie obiektu. Tak samo konfigurujemy obsługę CLI np. do Entity Framework, czy innych wybranych narzędzi.

[code]
<ItemGroup>
<PackageReference Include="Microsoft.AspNetCore" Version="2.0.0" />
</ItemGroup>
[/code]

W dokumencie program.cs ustalamy parametry do inicjacji serwera, a w startup.cs możemy “wczepić” nasze moduły, oraz konfigurację serwera, zawierającą takie informacje jak lokalizacja plików, przekierowywanie czy ustawienia.

Kontrolery

Jeśli ktoś miał już doczynienia z asp.net mvc czy z web api, to może pominąć ten akapit, ponieważ nic odkrywczego tutaj nie znajdziecie. Jeśli jednak jesteś ciekaw – zapraszam. Generalnie, kontroler służy do obsługi zapytań na poziomie HTTP – w przypadku API -> REST, a w przypadku Razor’a -> zwrot Widoków (CSHTML).

Przekierowywanie zapytań

Aby ułatwić sobie zapytania – “adresologię” (do zapytań) – w asp.net core używamy Routingu. Może się odbyć to na 2 sposoby:

1. Startup.cs
W metodzie Configure, dodajemy kolejne ścieżki:

[csharp]
app.UseMvc(routes =>
{
routes.MapRoute(
name: "default",
template: "{controller=Home}/{action=Index}/{id?}");
});
[/csharp]

Ważne! nazwy routingów nie mogą się powtarzać 🙂

2. Atrybuty w kontrolerze
Ten sposób jest jak dla mnie bardziej intuicyjny i żałuję, że go wcześniej nie odkryłem. Przy nazwie klasy kontrolera, umieszczamy główne przekierowanie:

[csharp]
[Route("Pogoda")]
public class WeatherController: Controller
[/csharp]

Dzięki czemu, zapytania zaczynają się od adres:port/Pogoda/
A następnie przy metodach ustalamy szczegółowe zapytania, jak np:

[csharp]
[HttpGet("{miasto}")]
public async Task<IActionResult> Get(string miasto)
[HttpGet("Full/{miasto}")]
public async Task<IActionResult> GetFull(string miasto)
[/csharp]

Tak więc w 1. przykładzie mamy adres:port/Pogoda/{miasto} a w drugim adres:port/Pogoda/Full/{miasto}

Wstrzykiwanie zależności

Niektórzy wstrzykują sobie morfinę, inni kofeinę (np. aeropressem). W programowaniu, Depedency Injection nie jest aż tak inwazyjne, a nawet zbawienne. Jest to przydatny pattern, zwłaszcza jak robimy większe serwisy.
Dla przykładu: WeatherService
Serwis, który implementuje interfejs IWeatherService ( w którym wrzuciliśmy metody: )

[csharp]
Task<Weather> GetForCity(string city);
Task<WeatherSummary> StatusForCity(string city);
Task<FileStream> ImageForCity(string city);
Task<FileStream> ImageForCity(string city, int hour);
Task<WeatherSummar> StatusForCity(string city, int hour);
[/csharp]

A następnie wrzuciliśmy do Startup.cs w ConfigureService:

[csharp]
services.AddSingleton<IWeatherService, WeatherService>();
[/csharp]

Równie dobrze, w WeatherService możemy wrzucić inne klasy, bazujące na tym samym interfejsie, ale korzystające np. z innego API pogodynki, czy z API testowego, podkładającego nam dane z kosmosu, czy nawet ze Słońca (na które podobno w Korei Północnej dolecieli w nocy oraz wrócili tego samego dnia) 🙂
A teraz najlepsze, żeby dostać się do naszego serwisu, czy każdego innego istniejącego, w konstruktorze kontrolera (lub innego serwisu)
dodajemy parametr IWeatherService oraz przypisujemy go do lokalnej zmiennej.
O taaaak:

[csharp]
public WeatherController(IWeatherService weather)
{
_weather = weather;
}
private readonly IWeatherService _weather;
[/csharp]

Możemy pójść GŁĘĘBIEJ i wejść w kolejny stan snu!
W lifelike.pl użyłem repozytoria do danych ILinkRepository , w LinkRepository odwołuję się do wstrzykniętej w startup.cs bazy:

[csharp]
private readonly PortalContext _context;
public LinkRepository(PortalContext context)
{
_context = context;
}
[/csharp]

Dzięki temu, warstwa operowania na danych jest pomiędzy, a bazę… zawsze można zmienić 🙂 tak samo zapytania do bazy. Dzięki temu kontroler nie musi wiedzieć co głębiej dokładnie siedzi. Tylko dostaje metody, które może użyć 🙂

Szczegóły na : Dependency Injection in ASP.NET Core

(https://docs.microsoft.com/en-us/aspnet/core/fundamentals/dependency-injection)

Podgląd API

Jestem człowiekiem praktycznym, jeśli coś dobrze działa, to używam, jeśli chcę odkryć jak coś działa.. piszę to sam. Tu jednak posłużę się gotowcem. Jeśli tworzymy API, które dostarczamy innym programistom czy klientowi, polecam użyć biblioteki Swagger. Generuje ona stronę, która wyświetla wszystkie zapytania API, które mamy w naszych kontrolerach, opierając się na atrybutach oraz tworzy od razu tester tych metod.
Przykład można znaleźć na [Swagger UI](http://czyjebnie.pl/swagger/)
Instalacja tego jest prosta.
Dodajemy paczki:

Swagger

[code]
<PackageReference Include="Swashbuckle.AspNetCore" Version="1.0.0" />
<PackageReference Include="Swashbuckle.AspNetCore.Swagger" Version="1.0.0" />
<PackageReference Include="Swashbuckle.AspNetCore.SwaggerGen" Version="1.0.0" />
<PackageReference Include="Swashbuckle.AspNetCore.SwaggerUI" Version="1.0.0" />
[/code]

A następnie w startup w ConfigureServices dodajemy:

[csharp]
services.AddSwaggerGen(c =>
{
c.SwaggerDoc("v1", new Info { Title = "CzyJebnie API",
Version = "v1",
Description = "API do pogodynki pod tytułem CzyJebnie",
TermsOfService = "None",
Contact = new Contact { Name = "Szymon Motyka", Email = "szymon@lifelike.pl", Url = "https://lifelike.pl"}
});
});
}
[/csharp]

oraz w Configure:

[csharp]
app.UseSwagger();

// Enable middleware to serve swagger-ui (HTML, JS, CSS etc.), specifying the Swagger JSON endpoint.
app.UseSwaggerUI(c =>
{
c.SwaggerEndpoint("/swagger/v1/swagger.json", "My API V1");
});
[/csharp]

A podgląd dostępny na adres:port/swagger/
Proste, czyż nie 🙂 ? Taki “rocket science” na poziomie Korei Północnej!
I nie… to nie jebnie!

Podsumowanie

Zostawiam was z takim cliffhangerem i każę czekać do następnego odcinka, który pojawi się za tydzień. Przy okazji, mały screenshot z nowego feature’a w lifelike : rpg (muszę jakoś sensowniej ponazywać projekty). Jest to drop system grafiki w postaci aeropressu oraz apteczki polowej, zostały wykonane przez Olę. Web player będzie dostępny, jak skończę cały ten motyw.

LifeLike: RPG & WEB i CzyJebnie.pl

Hej, dzisiaj chciałbym poruszać tematykę małych update’ów.
Pierwszym jest gra LifeLike, a drugim serwis LifeLike oraz jeden mały bonus 🙂

LifeLike: RPG

Trochę dawno nie robiłem aktualizacji w tym temacie, ale w końcu skończyłem 1. wersję ekwipunku! 🙂

Tzn. jest okno pod klawiszem „i” z wyborem ekwipunku (lista) na razie z predefiniowanymi elementami, które możemy wybrać do naszego ekwipunku.

Ekwipunek v 0.1

Link do repo: https://github.com/aluspl/RogueLikeDSP

LifeLike: Web

Ostatnio zamiast na rozwijaniu gry, skupiam się na projekcie strony, o czym ostatnio wspominałem.
Obecnie najnowszą zmianą jest dodanie dynamicznych stron na bazie znaczników markdown oraz galerii. Dodatkowo zmieniłem cały CSS na jaśniejszy motyw.

Nowa strona główna Lifelike.pl

Strona może korzystać też opcjonalnie z bazy SQLite (w startup.cs wystarczy odkomentować fragment z SQLite).
Dodatkowo galeria posiada początkowe formatowanie – tu dodanie tekstu w markdown.
Tak samo linki do Youtube’a, teraz wystarczy wkleić cały link, a nie tylko ID.

Warto tez wspomnieć o innym kluczowym feature tej wersji Galeria Zdjęć:

Link do repo: https://github.com/aluspl/LifeLIke

CzyJebnie.pl

Tak, trochę bekowo i na luzie zrobiłem swoją własną “pogodynkę”.
Przyznam, że miałem poważny dylemat, co do wyboru źródła, z którego mają pochodzić dane. Czyli które API wybrać.
Wygrało https://api.darksky.net/ ze względu na prostotę. Czy będę tego żałował ? Zobaczę 😉 Najwyżej przejdę na openweathermap.
Zainspirowało mnie do tego projektu sobotnie ognisko i mem z kotem (Andrzej, To jebnie).
Domena http://czyjebnie.pl była dostępna i kupiłem na thecamels.org za 10 zł. Przyznam, że z racji irytującego zmieniania się półki cenowej na Azure, wolałem nie ryzykować z przekroczeniem budżetu 25$ , które jak ostatnio wspominałem każdy może dostać za konto w visualstudio.net. Wybrałem więc technologię zwaną DOCKER, którą przybliżył nam na warsztatach Michał Franc (link) .
Użyłem więc DigitalOcean: (https://m.do.co/c/a0ee3602fd94) , gdzie na start z ref linka dostałem 10$ dolarów (to jakieś 2 miesiące serwera ubuntu z 20GB dyskiem). Do 2-3 mikroserwisów nada się idealnie.
Ponownie wykorzystałem ASP.NET Core jako technologię. Tym razem jednak będę się ograniczał z razerem. Głównie będzie to API plus strona z instrukcją 🙂

[code]
http://czyjebnie.pl/Pogoda/{Miasto}
[/code]

Powyższe zapytanie pobierze stan dla danego miasta. Obecnie zwraca najbliższą pogodę, w której będzie padać, jeśli nie będzie – zwraca słoneczko 🙂

Andrzej, to jebnie: Użyj Parasola

Link do repo: https://github.com/aluspl/MicroServiceToJebnie

Vlog i sprzęt

Postanowiłem rozszerzyć trochę działalność VLOG’ową 🙂 Taki kierunek dla własnego rozwoju, swojej charyzmy itp.
Tym razem mniej gadany odcinek 4: Żywiec

Użyłem do niego Xiaomi Yi 4k+ i DJI Mavic Pro.

Xiaomi Yi4k+

O dronie już wspominałem nie raz. Kamerka to świeży zakup, wraz z gimbalem (który odebrałem po nagraniu filmu).
Kamerka już w standardzie w 4k ma znacznie lepszą stabilizację, niż kamerka 1. generacji na FHD. (zdjecie kamerki). Jest też znacznie bardziej energooszczędna (2.5x trzeba było ładować 1gen na jedno działanie 4k+). Niestety, podobnie jak dron i inne sprzęty 4k: wymaga szybkiej karty SD o dużej pojemności. 16GB = 12 min w 4k/25fps. Opcję Timelapse, itp. pokażę obszerniej w następnym odcinku, ale już w tym widać fragmenty z miasta Żywca.

Generalnie, samą kamerą byłoby znacznie stabilnych więcej ujęć z Grecji, a z Gimbalem to już poezja 🙂

Gimbal:

Feiyu Tech G5 z Xiaomi Yi 4k+

Feiyu Tech 5G. Na początku myślałem o SPG Live, którego użyłbym też do telefonu, ale jak to się mówi “Co jest do wszystkiego to jest do niczego”, więc skupiłem się tylko na jednym celu. Póki, co jestem zadowolony z wszystkiego poza dwoma funkcjami:
* Aplikacja na androida wygląda strasznie
* Brakuje mi opcji połączenia kamerki z gimbalem i przycisku który uruchamia nagrywanie/robienie zdjęć, itp.

Więcej o nim powiem, w następnym odcinku  😉

Appka pisana na kolanie chyba 😉

 

Projekt Gamedevowy

Inicjatywa Slackowo – Wrocławska. Więcej o niej powiem wkrótce 🙂 póki co przedstawiam wam etap planowania:

Projektowanie Gry: Faza pomysłów z pokemonową Inspiracją

Podsumowanie

To tyle na dzisiaj. Chyba wyczerpałem wszystkie kluczowe tematy. Jak zwykle zapraszam na kanał oraz powyższe strony. Jeśli macie jakieś sensowne pomysły, na niewkurzające innych “monetyzacje” (przynoszące mamonę) projekty, to dajecie śmiało 🙂

Przy okazji udzieliłem się na blogu Sowy, która także uczestniczyła na DSP2017   http://sowaprogramuje.pl/czy-programowanie-jest-trudne/  

Jeśli chcecie rozszerzenia konkretnej części, technologii lub tematu który do tej pory opisałem! Piszcie!
Przy okazji: Mam nowe logo!

DSP – Zaskoczenie

Hej! Wynik finalistów w Daj Się Poznać totalnie mnie zaskoczył. Dokładnie mówiąc… wskoczyłem do Top25 🙂

Zaskoczenie

Jest to o tyle większym szokiem, poniewa zwycięstwem dla mnie było zakończenie DSP na czas z 20 postami i jak wspominałem w poprzednim poście (link) nie wszystko udało mi się skończyć i dużo jeszcze mam do zrobienia. Obecnie jestem na etapie refactoringu i tworzenia ekranu z ekwipunkiem oraz pracuję nad innymi ulepszeniami. (Nie ukrywam -> tworzenie okien w Unity to katorga. Przypomina czasy Windows Forms) .

Głosowanie

Na podstawie poniższego screena, można zobaczyć, że dostałem się cudem – 13 pkt. Ale to wciąż wielkie zaskoczenie dla mnie.

DSP
Wyniki

Na tym etapie głosowanie stało się zewnętrzne – a to znaczy , że ja jak i reszta finalistów oczekujemy na Waszą pomoc.
Głosować można do 15 czerwca na stronie http://uczestnicy.dajsiepoznac.pl/ankieta
Przypomina trochę czasy Hackfest i imprezowego automatu 🙂 Aby zagłosować, trzeba wybrać minimum dwa projekty, na które głosujemy. Nie można zagłosować jedynie na jednego uczestnika!

Uczestnicy

Nie żebym skazywał Was na oddanie głosu typowo na mnie (choć punkty od każdego czytelnika mile widziane). Polecam zapoznać się i poczytać blog każdego z zwycięzców, a może ktoś jeszcze zasłuży na Wasze punkty.

P.s Każdy wie, że największym zaskoczeniem DSP2017 był blog o nazwie Departament Koloru  i pętle While oraz cyftowe tatuaże!

Gala

17 czerwca między 9:00 a 17:00 będę dostępny na gali DSP w siedzibie Microsoft’u. Mnóstwo wykładów, nagrody oraz “fame” związany z projektami.

The Ball

Przy okazji, Mini gra LifeLike : The Ball może wkrótce pojawi się w markecie mobilnym jako gra niezależna od LifeLike : RogueLike. Muszę usprawnić sterowanie za pomocą żyroskopu 🙂  Kto wie, może wersja i n a IOS się pojawi 🙂

Podsumowanie

Oczywiście, zapraszam na stronę http://lifelike.pl , która nabiera kolorów 🙂 Tworzona w ASP.Net Core z użyciem Razor’a (wiem, że teraz używa się Angulary, reacty itp.).
A poza tym 🙂 Zapraszam do obserowania bloga oraz kanału na YT.

Btw był to naprawdę  ciekawy czas. W trakcie 3 miesięcy DSP zdążyłem zmienić pracę 2. (kto wie, ten wie jak długo trwała sytuacja z Capgemini oraz założenie DG), zwiedzić Islandię <3 (http://kawowipodroznicy.pl) i Grecję!

Toast po raz 2. 🙂