Задаволены
- 01. Стварыце 3D-мэтавую старонку WebGL
- 02. Пачніце з WebVR
- 03. Рэагуйце на краш-курс
- 04. Як стварыць прыкладанне з Vue.js
- 05. Як хутка дадаць мікраўзаемадзеянне на свой сайт
- 06. Flexbox крок за крокам
- 07. Стварыце аніміраваны CSS-арт
- 08. Як дадаць анімацыю ў SVG з дапамогай CSS
- 09. Падручнік па HTML Canvas
- 10. Як пачаць з зменных шрыфтоў у Інтэрнэце
- 11. Стварыце PWA з нуля
- 12. Стварыце інтэлектуальны чат-бот
Праца ў Інтэрнэце азначае, што вы ніколі не можаце дазволіць сваім навыкам стаяць на месцы. Хоць асноўныя інструменты і мовы, якія існуюць гадамі, будуць вам добра служыць, новыя тэхналогіі, бібліятэкі і платформы ўвесь час з'яўляюцца, і хаця вы не можаце адсачыць усе, выплачвае быць, каб хуткасць з самымі папулярнымі дапаўненнямі да вэб-набору інструментаў.
Каб дапамагчы вам запоўніць прабелы ў вашых ноў-хаў, мы сабралі некалькі лепшых падручнікаў па самых папулярных тэхналогіях і метадах вэб-дызайну, якія ахопліваюць усё: ад анімацыі CSS да фреймворкаў JavaScript і вэб-тыпаграфікі. Чытайце далей, каб пачаць даваць ведаў у Інтэрнэце сур'ёзны імпульс.
- Самыя гарачыя тэндэнцыі вэб-дызайну 2019 года
01. Стварыце 3D-мэтавую старонку WebGL
3D мэтавая старонка WebGL - выдатны спосаб прыцягнуць увагу людзей, як толькі яны трапляюць на ваш сайт. З дапамогай WebGL вы можаце ствараць дзіўны 3D-кантэнт у браўзэры без неабходнасці убудоў, і ваш сайт будзе працаваць на ўсіх сучасных аглядальніках, а таксама на мабільных прыладах і планшэтах. У гэтым падручніку WebGL 3D паказана, як зрабіць драматычную мэтавую старонку з 3D-аб'ектам, які рухаецца ў адказ на мыш, а таксама маляўнічымі эфектамі часціц.
02. Пачніце з WebVR
Для больш захапляльнага 3D-праекта не шукайце далей, чым WebVR. Гэта API JavaScript для стварэння 3D-віртуальнай рэальнасці ў браўзэры і багатай, кансольнай якасці VR, якая адлюстроўваецца ў рэальным часе на настольных браўзэрах і мабільных прыладах. З невялікай колькасцю ведаў JavaScript і гэтым падручнікам WebVR вы хутка пачнеце ствараць свой першы вопыт WebVR.
03. Рэагуйце на краш-курс
У нашы дні вы не можаце проста спадзявацца на ванільны JavaScript, калі хочаце стварыць выдатныя вэб-праграмы. Калі вы хочаце атрымаць лепшыя вынікі, вам трэба дадаць React у свой спіс навыкаў працы ў Інтэрнэце; гэта самая папулярная бібліятэка JavaScript на блоку, і ёю карыстаюцца велізарныя сайты, такія як Facebook (дзе яна была распрацавана), Instagram і Netflix. Гэты відэаўрок ад Mosh Hamedani дапаможа вам пачаць працу; для больш глыбокага вывучэння прытрымлівайцеся гэтага курсу React.
04. Як стварыць прыкладанне з Vue.js
Яшчэ адзін карысны фреймворк JavaScript, які трэба ведаць, - Vue.js. Гэта лёгка даведацца, бо гэта параўнальна невялікая бібліятэка ў параўнанні з канкурэнтамі, яна напісана ў звычайным HTML, CSS і JavaScript, а дакументацыя рэгулярна абнаўляецца. У гэтым уроку Vue.js вы даведаецеся асноўную структуру прыкладання Vue, а таксама пра тое, як выкарыстоўваць Vue для стварэння ўласнага поўнафункцыянальнага прыкладання ў блогу.
05. Як хутка дадаць мікраўзаемадзеянне на свой сайт
Мікраўзаемадзеянне - гэта бліскучы спосаб дадаць візуальную цікавасць да вашага сайта, а таксама палепшыць даступнасць. Яны ўяўляюць сабой невялікія тонкія анімацыі, якія вы можаце дадаваць у элементы, каб забяспечыць візуальную зваротную сувязь, калі на іх націскаюць альбо наводзяць на іх мыш. І хаця даданне анімацыі на ваш сайт можа выклікаць шмат намаганняў - асабліва калі вы нічога не ведаеце пра анімацыю - вось просты спосаб зрабіць гэта з дапамогай Micron.js.
06. Flexbox крок за крокам
Для стварэння адаптыўных сайтаў, якія добра выглядаюць у кожным браўзэры, Flexbox - гэта інструмент, пра які трэба ведаць. Гэта дазваляе ствараць макеты ў стылі часопіса без абмежаванняў паплаўкоў і, каб мы не забыліся, табліц, і дае вам поўны кантроль над выраўноўваннем, кірункам, парадкам і памерам элементаў вашай старонкі. Гэты пакрокавы падручнік па Flexbox правядзе вас праз усё, што вам трэба ведаць.
07. Стварыце аніміраваны CSS-арт
Стварыць выявы CSS у браўзэры не так проста, як, напрыклад, проста намаляваць іх у Photoshop; вы ў асноўным малюеце вектарныя ілюстрацыі з выкарыстаннем кода CSS, і гэта можа заняць немалую колькасць драпін і эксперыментаў, перш чым вы ўсё зразумееце. Выгада стварэння фігур CSS заключаецца ў тым, што яны лёгкія і, як толькі вы зразумелі, што робіце, лёгка аніміраваць. Гэты падручнік па анімацыі CSS дапаможа вам пачаць працу.
08. Як дадаць анімацыю ў SVG з дапамогай CSS
Вось яшчэ адзін спосаб стварыць цудоўныя вэб-анімацыі. Выкарыстоўваючы CSS, вы можаце кіраваць асобнымі шляхамі ў SVG-вобразе, каб ствараць розныя эфекты, і калі вы ведаеце асновы, вы можаце выкарыстоўваць гэтыя метады, каб ператварыць звычайныя значкі ў нешта больш уражлівае. Гэта добры спосаб рэалізаваць мікраўзаемадзеянне на вашым сайце, і магчымасці бязмежныя; прытрымлівайцеся гэтага кіраўніцтва, каб дадаць анімацыю ў SVG з CSS, каб даведацца больш.
09. Падручнік па HTML Canvas
Трэці спосаб стварэння візуальных малюнкаў у браўзэры - выкарыстанне элемента палатна HTML. З яго дапамогай вы можаце маляваць графіку і тэкст, ствараць каляровыя градыенты і аніміраваць усё, а таксама дадаваць інтэрактыўныя элементы. Ён падыходзіць для ўсяго, ад асноўнай графікі да HTML-гульняў, і гэты падручнік ад W3Schools ахоплівае ўсе гэтыя прыкладання.
10. Як пачаць з зменных шрыфтоў у Інтэрнэце
Самае вялікае развіццё ў вэб-тыпаграфіцы з часоў вэб-шрыфтоў, зменныя шрыфты - гэта шрыфты, якія могуць паводзіць сябе як некалькі шрыфтоў, даючы вам усе патрэбныя вагі і стылі ў адным адносна невялікім файле, якім можна кіраваць з дапамогай табліц стыляў. Гэты онлайн-буквар растлумачыць усё, што вам трэба ведаць, каб пачаць максімальна выкарыстоўваць іх. Вы таксама можаце прачытаць больш пра зменныя шрыфты тут.
11. Стварыце PWA з нуля
Калі вы хочаце стварыць лёгкія сайты, якія будуць працаваць на кожнай прыладзе, і для працы вам нават не патрабуецца падключэнне да Інтэрнэту, прагрэсіўныя вэб-праграмы - гэта шлях. У гэтым кароткім кіраўніцтве Ясіна Бенабаса да PWA вы пазнаёміцеся з чатырма асноўнымі крокамі, якія вам трэба ведаць - падрыхтоўка абалонкі прыкладання, даданне маніфеста, рэалізацыя рабочага службы і кэшаванне, каб пабудаваць PWA з нуля.
12. Стварыце інтэлектуальны чат-бот
Штучны інтэлект - гэта велізарная і складаная тэма, але надзіва проста рэалізаваць яго спосабамі, якія могуць значна палегчыць вам жыццё. У гэтым падручніку па чаце AI вы даведаецеся, як выкарыстоўваць AI для стварэння чат-бота на натуральнай мове, які дапаможа карыстальнікам ўзаемадзейнічаць з вашым сайтам. Працуе з дапамогай набору інструментаў Dialogflow ад Google, ён выкарыстоўвае машыннае навучанне і маўленне ў тэкст, і яго можна наладзіць пад вашыя патрэбы і дадаць на ваш сайт у выглядзе віджэта.
