MVC

Model ten korzysta z wzorca MVC - ciekawe sformułowanie :)

M jak Model

 

W katalogu Models, umieszczamy kod, który odzwierciedla strukturę naszej bazy danych. Są dwa podejścia: code-first - my tworzymy pliki zawarte w tym katalogu lub database-first pliki są automatycznie wykonanym zrzutem naszej bazy. Pliki są normalnymi klasami.

V jak Widok

Pliki umieszczamy w folderze Views. Pliki odpowiedzialne są za prezentację danych dostarczonych przez kontroler. Tutaj używamy HTML‚ CSS i innych języków do zarządzania wyglądem naszej strony. Wybrany do projektu silnik renderujący kod to ASPX.

C jak kontroler

Pliki składowane są w folderze Controllers. Kod zajmuje się odbiorem, analizą i przetwarzaniem danych zarówno tych pobranych z bazy danych jak i wprowadzonych przez użytkownika. Kontroler ma możliwość zarządzania informacji z bazy od modelu, wysłania danych do modelu.

Zalety
1. Logiczna struktura katalogów
2. Izolacja logiki od interfejsu użytkownika
3. Łatwa testowalność kodu
4. Przejrzystość

ASP .NET

Zdecydowałam się na napisanie projektu w ASP .NET, ponieważ jest przeznaczony do tworzenia dynamicznych stron internetowych, pozwala na szybkie i proste tworzenie serwisów internetowych, umożliwia oddzielenie kodu od widoku i można go wykorzystać zarówno do prostych, jak i bardziej skomplikowanych serwisów.

Według Wikipedii "ASP.NET – zbiór technologii opartych na frameworku zaprojektowanym przez firmę Microsoft. Przeznaczony jest do budowy różnorodnych aplikacji internetowych, a także aplikacji typu XML Web Services."

Czyli jest to program, który pracuje na serwerze, a komunikuje się z klientem poprzez przeglądarkę internetową. Kod programu może być zapisany w np. języku Visual Basic, C#, F#. Mój projekt tworzony jest w C#. Niewątpliwą zaletą jest możliwość debuggowania kodu i szybkiego wykrywania błędów.

Możliwe jest zastosowanie modeli programistycznych:
1. Web pages - do tworzenia bardzo prostych stron internetowych
2. Web forms - do tworzenia mniej skomplikowanych projektów
3. MVC - Model-View-Controller - do tworzenia zaawansowanych projektów

Wydawać by się mogło, że do stworzenia stronki Gabinetu Kosmetycznego można wybrać najprostszy model programistyczny, a do rezerwacji wizyt może wystarczyłby web forms. Jednak MVC ... jest już teraz standardem. Myślę, że przyjrzę się temu z bliska.

Podsumowanie końca początku

Mija trzeci tydzień zmagań z projektem, a ja cały czas jestem w sferze teorii. Moje dokonania to:

1. Instalacja oprogramowania (całe 3 tygodnie, cały czas czegoś brakuje)
2. Ogólne wyobrażenie strony i tego co ma się tam znaleźć
3. Bootstrap - nauka, chociaż uczyć się jeszcze będę na bieżąco

a to co najbardziej lubię - nie ruszone, czyli baza danych, algorytmy itp. Pocieszam się, że to co umiem zostawiam na później, będzie łatwiej.

Dobrze, że jest na to 10 tygodni.

Tak prywatnie to ostatni tydzień zmagaliśmy się z chorobami, a następny nie zapowiada się na lepszy :(

Bootstrap vs Foundation

Responsywaność tak, tak, tak!!!

Porównanie frameworków

	Bootstrap	Foundation
media-view	dodajemy 'media-view' gdy potrzebujemy zaprojektować wersję na mniejsze rozdzielczości	dodajemy 'media-view' jeśli chcemy zaprojektować coś na większe ekrany
system siatki	system siatki polega na określeniu statycznych rozmiarów dla których następuje zmiana styli tzw. punkty przejścia (breakpoints) -można użyć klasy dla określenia procentów - będzie efekt jak w Foundation	efekt skalowalności
jednostki	pixel	rem
możliwość dopasowania	można dopasowywać, ma wiele możliwości zmiany stylu	można dopasowywać, ma mniejsze możliwości zmiany stylu
wsparcie przeglądarek	wspiera wszystkie przeglądarki	wspiera wszystkie przeglądarki z wyjątkiem IE 8

- wybór frameworka dokonany - Bootstrap
Jest bardziej popularny, łatwiej modelowany i informacji o nim są bardziej dostępne. Poza tym wspiera wszystkie przeglądarki.
Stronka przede wszystkim ma dobrze wyglądać na dużym ekranie.

Framework Foundation

Okazuje się, że frameworków do responsywnych stron jest więcej. Drugim popularnym jest Foundation. Posiada on 12-kolumnową siatkę (grid) zapewniającą układ, strukturę strony, style dla przycisków, formularzy. Wszystkie te elementy są skalowalne w zależności od urządzenia, na którym jest wyświetlane.

Tak jak w bootstrap należy w dodać link do stylów

<link rel="stylesheet" href="stylesheets/foundation.css">
<link rel="stylesheet" href="stylesheets/app.css">

oraz linków do skryptów

<script src="javascripts/jquery.min.js"></script>
<script src="javascripts/modernizr.foundation.js"></script>
<script src="javascripts/foundation.js"></script>
<script src="javascripts/app.js"></script>
Podstawową różnicą pomiędzy dwoma frameworkami jest to, że Foundation ma podejście projektowe typu najpierw mobilne (mobile-first), Bootstrap odwrotnie.

No to teraz muszę zdecydować.

Bootstrap

W dzisiejszych czasach tworząc stronę internetową musimy pamiętać, że klienci mogą siedzieć wygodnie w domu przed komputerem w poszukiwaniu pani kosmetyczki, siedzieć w pociągu i z nudów przeglądać salony używając tabletu, lub biegnąc gdzieś między samochodami na parkingu i pospiesznie przeglądać strony na komórce, bo muszę zaraz ...

Dlatego ważne jest żeby strona była responsywna. Dlaczego nie skorzystać z gotowego frameworka css? Jednym z najpopularniejszych jest obecnie Bootstrap. Wspiera popularne przeglądarki: Firefox, Chrome, Opera, Safari, IE8+. Zawiera 12-kolumnową siatkę w wersji ze stałą i z automatyczną szerokością. Ułatwia tworzenie typografii, formularze, tabele, nawigację i ikonki. Skryptów JS pozwalająca na obsługę okien modalnych, dropdownów, akordeonów czy sliderów.

Proste, ściągamy Bootstrapa, do sekcji <head> dodajemy link do jego lokalizacji:

<link href="css/bootstrap.min.css" rel="stylesheet">

Dodajemy możliwość korzystania ze skryptów:

 <script src="js/bootstrap.min.js"></script>

i gotowe. Można już korzystać z frameworka.

W poszukiwaniu natchnienia

Lubię rozwiązywać problemy, szukać optymalnych rozwiązań, wyszukiwać błędy w kodzie, sprawiać, by po kliknięciu jednego "przycisku" coś "magicznie" się zadziało. Za to nie przepadam za tworzeniem grafiki. Niestety większość, co ludzie zauważają i na co zwracają uwagę to właśnie to, co widać.

Dlatego jest to dla mnie bardzo trudny etap tego przedsięwzięcia. Zaczynam o rozeznania rynku, jak wyglądają typowe strony gabinetów kosmetycznych.

Wyobrażam sobie, że powinna być jasna - to kojarzy się z czystością, znaki graficzne powinny być lekko zaokrąglone - skojarzenie z delikatnością.

Co powinna zawierać?
Oczywiście:

• zakres usług,
• cennik (ech..),
• dane kontaktowe z mapką jak dojechać,
• oraz oczywiście, główny mój cel - możliwość zarejestrowania się na wizytę, a co za tym idzie także panel dla pani kosmetyczki.

Pewnie przydałby się mechanizm przypomnienia o wizycie klientkom.

Uff, obejrzałam parę stronek i myślę, że projekt pewnie będzie ewaluował. Cel na następny tydzień: grafika.

Daj się poznać

Zawsze myślałam, że programista to taki cichy człowiek siedzący przed komputerem i klepiący w klawiaturę, a tu się okazuje, że znalazł się gość, który twierdzi inaczej ... No to spróbuję "dać się poznać". Nie wybrałam projektu ambitnego, ale od czegoś trzeba zacząć.

Więc będzie to zwykła / niezwykła stronka, dla zwykłego / niezwykłego Gabinetu Kosmetycznego. Zwykła, bo któż nie umiałby napisać stronki dla Gabinetu Kosmetycznego? Niezwykła, bo zwykle w takich miejscach ludzie cenią sobie prywatność i wolą kontakt osobisty.

A może powstanie z tego coś większego?

A więc start: let's install Visual Studio Community i SQL Server Express