Setup projektu -

Setup projektu

No to ruszamy z projektem! Na wstępie jeszcze mała uwaga dotycząca postów, a raczej częstotliwości ich publikacji. Na początku projektu chciałbym pisać częściej, przez to pewnie krócej. Jest to ukłon w kierunku osób totalnie początkujących, które nie wiedzą z której strony zabrać się za aplikację webową.W postach tych omówię kolejne kroki tj. konfiguracja projektu, projektowanie kolejnych warstw aplikacji, “stawianie” bazy danych wraz z ORM oraz wszelkie konfiguracje .NET-owych managerów. Z czasem, gdy projekt będzie zawierał “pożądaną” przez mnie architekturę, skupię się raczej na kluczowych funkcjonalnościach/ zagadnieniach oraz na problemach. Jeszcze jedno –  jeśli kogoś z Was nie interesuje .NET to zapraszam do mojego pierwszego posta z cyklu Aurelia.io (autoreklama zawsze śmieszna). Ok, do pracy rodacy!

Pierwszą rzeczą będzie pobranie oficjalnej paczki z strony Aureli. Zawiera ona cztery skonfigurowane projekty tj. :

  • Aurelia z ES6
  • Aurelia z ES6 skonfigurowana pod Visual Studio 2015 + ASP.NET Core.1 (wcześniej nazwane ASP.NET 5)
  • Aurelia z TypeScript
  • Aurelia z TypeScript skonfigurowana pod Visual Studio 2015 + ASP.NET Core.1

Interesuje mnie ostatnia pozycja, dlatego też kopiuję projekt do folderu z moim REPO. Z racji tego, że Aurelia używa kolejnego package managera, tj. jspm, należy go zainstalować poprzez npm. Cały proces opisany jest dobrze tutaj. Czas otworzyć projekt w VS2015 i zobaczyć jakież to niespodzianki przyszykował nam Rob Eisenberg z ekipą. Struktura plików wygląda następująco:

pliki-domyslne

Omówmy pokrótce co my tu mamy. Po pierwsze wwwroot czyli nowość w ASP.NET 5. Jest to folder główny naszego projektu, który zawiera pliki CSS, obrazki, paczki jspm, biblioteki js, web.config. Idea jaka stoi za wprowadzeniem tego folderu to odseparowanie kodu od statycznych plików. Części z Was słusznie powinien się kojarzyć z IIS (Inetpub/wwwroot)


 

W folderze build najważniejsze póki co są dla nas dwie rzeczy (przepraszam, że nie widać tego na obrazku, ale nie chciałem przesadzić z jego długością). Po pierwsze folder tasks zawierający przygotowane przez zespół Aureli zadania dla Gulp.js m.in:

  • budowanie projektu
  • bundling przy pomocy aurelia-bundler (ideę opiszę szerzej w cyklu Aurelia.io)
  • uruchamianie testów End-To-End (E2E)  

Po drugie w folderze buid zawarty jest także bundle.json zawierający samą definicję bundli (w poprzedniej wersji ASP.NET definiowane w BundleConfig.cs).


 

Folder Controllers zawierać będzie nasze kontrolery – i tutaj ważna sprawa. W poprzednich wersjach ASP.NET istniał podział pomiędzy kontrolerami MVC, oraz Web API. W nowej wersji wszystko zostało zintegrowane do postaci MVC 6 (nieźle mnie strollowali, bo kiedy wpisywałem ASP.NET 5 Web API to cały czas przekierowywało mnie właśnie do tej frazy, przez co prawie nie wyrzuciłem komputera za okno 😀 tak to jest jak się najpierw nie przeczyta).


 

Kolejnym folderem jest src – tu znajdą się wszystkie widoki oraz viewModele naszej aplikacji.


 

Folder test będzie zwierać testy naszych skryptów, które napiszemy przy pomocy karma.js (test runner) oraz protractor.js (stworzony do testów E2E)


 

Folder typings zawiera pliki *.d.ts, dzięki którym wszystkie metody, klasy, obiekty, które znalazły się w Aureli oraz innych bibliotekach będą widoczne w intellisense podczas pisania w TypeScript.


 

Kolejnym jest folder Views, który również powinien być znany osobom piszącym w MVC. To właśnie z tego miejsca w widoku Index.html inicjowana jest Aurelia. Reszta plików jest domyślnie generowana przez ASP.NET.

 


Dalej znajdują się pliki konfiguracyjne dla aplikacji, karmy, protractora,kompilatora TypeScript, plik główny Gulp.jsoraz serce naszej aplikacji tj. Startup.cs czyli klasa uruchamiana przy starcie aplikacji.

 

Opisanie wszystkiego szczegółowo trochę mija się z celem, tak więc jeśli jesteście ciekawi, co dokładnie zawierają poszczególne pliki to zapraszam Was na githuba Aurory. Przejdźmy teraz do samej struktury aplikacji. Prezentuje się ona następująco:

struktura-projektu

Strzałki na schemacie reprezentują referencje do projektów. Był plan, aby wprowadzić CQRS oraz NoSQL, ale wiedzę na ten temat mam jedynie teoretyczną i bałem się, że 10 tygodni nie wystarczyłoby na uruchomienie aplikacji 😀 Wszystkich miłośników przepraszam. Jak wcześniej wspomniałem, dokładny opis + implementację każdej warstwy opiszę w dedykowanych dla nich postach. Pierwszy z nich tj. tworzenie bazy danych w EF7 poprzez Code-First powinien pojawić się najpóźniej w niedzielę.

Wracając do samego projektu, tak prezentuje się solucja zawierająca 4 warstwy:

projekt

Każda z nich reprezentowana jest przez jeden projekt (Class Library dla ASP.NET 5). Referencje dodajemy klikając PPM w References -> Add Reference… -> Projects, po czym wybieramy projekt z solucji.

Ok, sprawdźmy czy nic nie nabroiliśmy i aplikacja faktycznie działa. Klikamy IIS Express iiiiii…. IT’S ALIVE !!! 1 1 1 one one one

home

Na dziś to tyle 🙂 Czas trochę pokodzić, żeby mieć co opisywać 😀

You may also like...