Witam mam takie pytanko, programuje trochę w C++ ale chciałbym też zająć się projektowanie stron. Na początku chciałbym się pouczyć podstaw HTML5, CSS3, JAVA SCRIPT, PHP, MySQL. A dopiero jak nauczę się podstaw to przejdę to jakiś innych rozwiązań. I czy znacie jakieś książki (najlepiej jak były by połączone np na helion.pl widziałem książkę która opisuje i HTML5 i CSS3).
0
1
Z tego co pamiętam to helionie masz ładnie uporządkowane opinie różnych użytkowników jak i również ocenę książeczek. Tyle Ci się nie chce wejść i poczytać?
0
Książki - można i tak. Możesz pooglądać tutoriale w sieci (youtube i strony z kursami). Możesz zapoznać się z http://www.w3schools.com/ i dostępnymi tam materiałami.
Zainstaluj sobie wamp, xampp lub lamp (co tam chcesz i lubisz) i działaj. Dodaj do tego dobry edytor np. Sublime +Emmet lub Atom i działaj.
1
Desu napisał(a):
Step 0. Wybór edytora *Szacowany czas: - *
Polecam https://www.sublimetext.com/.Step 1. Nauka HTML Szacowany czas: max. 1 dzień
Nie ma się tutaj za bardzo nad czym rozdrabniać. Potrzebujesz wiedzieć co to jest HTML i poznać podstawowe znaczniki oraz atrybuty tych zniaczników. Ogólny template każdej strony to:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
nad tym się nie zatrzymuj. Przyjmij, że tak jest i broń boże nie zapamiętuj tych wszystkich meta tagów, które są tłumaczone w kursach bo na początku nie jest Ci to potrzebne. Skopiuj, wklej i tyle. Skup się na tagach takich jak: section, footer, header, aside, article, h1-h6, a, p, span, div, ul, ol.
**Polecane materiały: **
http://www.99lime.com/_bak/topics/you-only-need-10-tags/
http://html5doctor.com/lets-talk-about-semantics/Challenge:
Zakoduj prostą stronę. Możesz się wzorować na tej http://motherfuckingwebsite.com/.Step 2. Nauka CSS Szacowany czas: ok. tygodnia
W tym kroku nauczysz się nadawać wygląd stronie. Poznasz nowe atrybuty takie jak `class`, `id`. Trzymając się zasady pareto (znanej też pod nazwą 80/20) uczysz się najczęściej używanych rzeczy. Googluj po: *common CSS properties, most used CSS properties*.**Polecane materiały: **
http://zellwk.com/blog/9-important-css-properties-you-must-know/
http://tech.journalism.cuny.edu/documentation/css-cheat-sheet/
http://www.expression-web-tutorial.com/CSS-Properties.html#.Vyr5A2F97Hw
http://code.tutsplus.com/tutorials/10-css3-properties-you-need-to-be-familiar-with--net-16417
http://learnlayout.com/position.html WAŻNE!!
https://css-tricks.com/centering-css-complete-guide/ WAŻNE!!
https://css-tricks.com/snippets/css/a-guide-to-flexbox/ WAŻNE!!Challenge:
Ostyluj stronę, którą wczesniej zakodowałeś oraz wykonaj 1/2 templaty z dowolnej listy, polecam:
http://www.dreamtemplate.com/templates/simple-personal-css-templates.html
www.mezzoblue.com/zengarden/alldesigns/Step 3. Nauka frameworka CSS *Szacowany czas: ok. tygodnia - dwóch *
Do wyboru masz w zasadzie Bootstrap lub Foundation. Obojętne, które wybierzesz (bootstrap popularniejszy). Framework jest to szkielet do budowy aplikacji. W kroku drugim wszystko robiłeś sam, a tutaj rzeczy, które są używane bardzo często są już zrobione dla Ciebie (żebyś nie musiał wynajdywać koła od nowa).**Polecane materiały: **
http://strefakursow.pl/kursy/web_design/kurs_bootstrap_3_-_responsywne_strony.html Biję się w pierś, że to tutaj umieszczam, ale co jak co to ten kurs mi pomógł.Challenge:
Wybierz jakiś template z tej strony http://startbootstrap.com/template-categories/all/ i go sam zakoduj.Step 4. Nauka javascript Szacowany czas: dwa - trzy miesiące *
Mamy content, style to teraz czas, żeby z naszą stroną się coś działo.**Polecane materiały: **
http://helion.pl/ksiazki/programowanie-w-javascript-rusz-glowa-eric-t-freeman-elisabeth-robson,prjsrg.htmChallenge:
Zrób jakis walidator formularza, jakąś prostą karuzelę itp.https://github.com/getify/You-Dont-Know-JS
BARDZO WAŻNE
Na tym etapie powinieneś zapoznać się z metodami debugowania. Jest to bardzo wazne, a znam miliony programstów, którzy na oślep szukają błędów używającconsole.log.
Debugging JavaScript - 0 to Heisenberg
Useful JavaScript debugging tips you didn't knowChallenge:
Gra w snake'a, jakieś statki, albo mini paint w przeglądarce.Pierwsza książka łagodnie Cie wprowadzi do świata javascriptu i da poczucie, że coś umiesz.
Druga ksiązka (a raczej seria) wyprowadzi Cie z błedu, że cokolwiek umiałeś i da Ci solidną dawkę wiedzy, która będzie podstawą do dalszego rozwoju.Step 5. Nauka jQuery *Szacowany czas: miesiąc * *
jQuery to biblioteka (czy jak niektórzy mówią framework) do javascriptu. **Stąd JS uczysz się najpierw!** Tak samo jak w przypadku css, jquery daje Ci już gotowe rozwiązania do popularnych problemów, przykład:Javascript
var request = new XMLHttpRequest();
request.open('GET', '/my/url', true);
request.onload = function() {
if (request.status >= 200 && request.status < 400) {
// Success!
var data = JSON.parse(request.responseText);
} else {
// We reached our target server, but it returned an error
}
};
request.onerror = function() {
// There was a connection error of some sort
};
request.send();
To samo w jQuery:
$.getJSON('/my/url', function(data) {
});
*Źródło: youmightnotneedjquery.com *
Challenge:
Możesz przerobić swoje rozwiązania z kroku 4 z użyciem jQuery.
Warto tutaj poświęcić również trochę czasu na poczytanie kodu źródłowego np. tej karuzeli http://www.owlcarousel.owlgraphic.com/ i spróbować zrozumieć co tam się dzieje.Końcowy Challenge
Wchodzisz na tą stronę http://themeforest.net/category/all i wybierasz dowolny template, po czym kodujesz go sam od podstaw.Od tego miejsca możesz iść w kierunku Frontend (preprocesory CSS, metodyki typu BEM, SMACSS, ReactJS, AngularJS, webpack, nodejs i npm..) lub Backend. To co Ci napisałem to ogólny zarys, bo wiem, że na początku można się w tym wszystkim zgubić. Zawsze bądź głodny wiedzy i naucz się szukać informacji.
Powodzenia.
PS. Nie warto kupować materiałów ze stron typu strefakursów, czy eduweb. Wiem, że sam wyżej poleciłem jeden z nich, ale to z lenistwa. Po prostu możesz obejrzeć ten tutorial na prędkości 1.25/1.5 biorąc kąpiel i załapiesz bootstrapa (co jest łatwiejsze niż szukanie informacji w internecie). Widziałem bardzo duzą częśc materiałów od nich i lepiej na tym wyjdziesz jak kupisz sobie książkę i dobrą kawę/herbatę niż ten kurs.
* oczywiście mowa o podstawach podstaw.
0
Bardzo dziękuję za wszystkie odpowiedzi.
0
Nie pakuj się w stare PHP i Jave, wybierz Node.js lub Python, Django. Ruby też fajne, ale utarło się już że do tego trzeba mieć drogi sprzęt Apple, na innym słabo to działa, no może na Ubuntu 16.04 lts jeszcze w miarę.