1. ÐлПМ Notion
ÐÑОлПжеМОе Notion пПлÑбОлПÑÑ ÐŒÐœÐŸÐ³ÐžÐŒ, ПМП пПзвПлÑÐµÑ ÐŸÐ¿ÑОЌОзОÑПваÑÑ ÑабПÑОй пÑПÑеÑÑ, ÑабПÑаÑÑ Ñ ÐŽÐŸÐºÑЌеМÑаЌО, плаМОÑПваÑÑ Ð·Ð°ÐŽÐ°ÑО, ÑÐžÐœÑ ÑПМОзОÑПваÑÑ ÐŽÐ°ÐœÐœÑе ÐŒÐµÐ¶ÐŽÑ ÑÑÑÑПйÑÑваЌО.
Ð§ÐµÐŒÑ Ð²Ñ ÐœÐ°ÑÑОÑеÑÑ, ÑÐŸÐ·ÐŽÐ°Ð²Ð°Ñ ÐºÐ»ÐŸÐœ Notion:
- . ÐПлÑзПваÑÐµÐ»Ñ ÐŒÐŸÐ¶ÐµÑ Â«ÑÑ Ð²Ð°ÑОÑÑ ÐŒÑÑкПй» draggable ÑÐ»ÐµÐŒÐµÐœÑ Ðž пПЌеÑÑОÑÑ ÐµÐ³ÐŸ в droppable зПМÑ.
- Ðак ÑÐžÐœÑ ÑПМОзОÑПваÑÑ Ð² ÑежОЌе ÑеалÑМПгП вÑеЌеМО ЎаММÑе ÐŒÐµÐ¶ÐŽÑ ÐºÐŸÐŒÐ¿ÑÑÑеÑПЌ О ÑЌаÑÑÑПМПЌ.
- ÐÑ Ð¿ÐŸÐ·Ð²ÐŸÐ»ÑеЌ пПлÑзПваÑелÑÐŒ ÑПзЎаваÑÑ, ÑОÑаÑÑ, ПбМПвлÑÑÑ Ðž ÑЎалÑÑÑ Ð·Ð°Ð¿ÐžÑО, ÑеЌ ÑаЌÑÐŒ ÐŒÑ ÑÑеМОÑÑеЌ CRUD-МавÑкО.
á¡á¢áá¢áá áááá áááá EDISON Software-áá¡ áá®áá ááááá áá, á ááááá᪠áá .
2. ÐлПМ Repl.it
Repl.it -ÑÑП ОМÑÑÑÑÐŒÐµÐœÑ ÐŽÐ»Ñ ÑПвЌеÑÑМПгП ÑеЎакÑОÑÐŸÐ²Ð°ÐœÐžÑ ÐºÐŸÐŽÐ° в ÑеалÑМПЌ вÑеЌеМО. ÐПжМП вÑбÑаÑÑ ÐœÐµÑкПлÑкП ÑзÑкПв: JavaScript, Python, Go О вÑпПлМÑÑÑ ÐºÐŸÐŽ пÑÑЌП в бÑаÑзеÑе. ÐÑÐµÐœÑ Ð¿ÐŸÐ»ÐµÐ·ÐœÐŸ ÐŽÐ»Ñ Ð±ÑÑÑÑÑÑ ÐŽÐµÐŒÐŸÐœÑÑÑаÑОй О кПЎ-ОМÑеÑвÑÑ.
Ð§ÐµÐŒÑ Ð²Ñ ÐœÐ°ÑÑОÑеÑÑ, ÑÐŸÐ·ÐŽÐ°Ð²Ð°Ñ ÐºÐ»ÐŸÐœ Repl.it:
- Ðак запÑÑкаÑÑ Ðž вÑпПлМÑÑÑ ÐºÐŸÐŽ (server-side) в бÑаÑзеÑе (client-side).
- СÑОÑÑваÑÑ Ð²Ñ ÐŸÐŽÐœÑе ЎаММÑе (ОÑÑ ÐŸÐŽÐœÑй кПЎ) О вÑвПЎОÑÑ ÐœÐ° ÑкÑаМ ÑезÑлÑÑÐ°Ñ Ð²ÑпПлМеМОÑ.
- Ðак ÑПзЎаваÑÑ ÑÐ°Ð¹Ð»Ñ Ðž папкО в вебе О ÑÐŸÑ ÑаМÑÑÑ ÑезÑлÑÑаÑÑ.
- Ðак пПЎÑвеÑОваÑÑ ÑОМÑакÑÐžÑ ÐºÐŸÐŽÐ°.
3. ÐлПМ Google Photos
Google Photos ÑÑП ÑеÑÐ²ÐžÑ ÐŽÐ»Ñ Ñ
ÑÐ°ÐœÐµÐœÐžÑ Ðž ПбЌеМа ÑПÑПк.
ÐÑбПе ÑПвÑеЌеММПе пÑОлПжеМОе пП ÑабПÑе Ñ ÑПÑПгÑаÑОÑЌО ÑÐŒÐµÐµÑ Ð²ÑпПлМÑÑÑ Ð±Ð°Ð·ÐŸÐ²Ñе ÑÑМкÑОО: загÑÑжаÑÑ, ПбÑезаÑÑ Ðž пÑ. ÐÑЎО Ñ
ПÑÑÑ ÑПзЎаваÑÑ ÑвПО аваÑаÑкО О ЎелОÑÑÑÑ ÑПÑкаЌО кПÑОкПв, пПÑÑÐŸÐŒÑ ÐœÐ°ÐŽÐŸ ÑЌеÑÑ ÑабПÑаÑÑ Ñ ÐžÐ·ÐŸÐ±ÑажеМОÑЌО.
Ð§ÐµÐŒÑ Ð²Ñ ÐœÐ°ÑÑОÑеÑÑ, ÑÐŸÐ·ÐŽÐ°Ð²Ð°Ñ ÐºÐ»ÐŸÐœ Google Photos:
- Ðак ÑПзЎаваÑÑ Ð°ÐŽÐ°Ð¿ÑОвМÑе ОзПбÑÐ°Ð¶ÐµÐœÐžÑ ÐœÐ° ÑелеÑÐŸÐœÐ°Ñ , плаМÑеÑÐ°Ñ , МПÑÑбÑÐºÐ°Ñ Ðž Ўаже Ма гОгаМÑÑÐºÐžÑ ÑкÑÐ°ÐœÐ°Ñ ÑелевОзПÑПв.
- Ðак ПбÑабаÑÑваÑÑ Ð·Ð°Ð³ÑÑÐ·ÐºÑ ÐžÐ·ÐŸÐ±ÑажеМОй, ПÑПбеММП бПлÑÑÐžÑ ÐžÐ·ÐŸÐ±ÑажеМОй (>1ÐÐ) О ЌаÑÑПвÑÑ Ð·Ð°Ð³ÑÑзПк.
- ÐбÑабПÑка ÑайлПв ОзПбÑажеМОй, ПбÑезка О ОзЌеМеМОе ÑазЌеÑа ÑПÑПгÑаÑОй ÐŽÐ»Ñ ÐŒÐžÐœÐžÐ°ÑÑÑ ÐžÐ»Ðž пÑО ПÑкÑÑÑОО галеÑеО.
- áá áááá: как Ñ ÑаМОÑÑ ÐžÐ·ÐŸÐ±ÑÐ°Ð¶ÐµÐœÐžÑ Ð² Пблаке ОлО лПкалÑМПй базе ЎаММÑÑ .
4. ÐлПМ Gifsky
кПМвеÑÑОÑÑÐµÑ Ð²ÐžÐŽÐµÐŸ в GIF ОÑпПлÑзÑÑ ÑÑМкÑОО ÐŽÐ»Ñ ÑÑÑекÑОвМÑÑ Ð¿Ð°Ð»ÐžÑÑ ÐºÑПÑÑ-каЎÑПв О вÑеЌеММПгП ÑглажОваМОÑ. Ð ÑезÑлÑÑаÑе пПлÑÑаеÑÑÑ Ð³ÐžÑка Ñ ÑÑÑÑÑаЌО ÑвеÑПв Ма каЎÑ.
Ð§ÐµÐŒÑ Ð²Ñ ÐœÐ°ÑÑОÑеÑÑ, ÑÐŸÐ·ÐŽÐ°Ð²Ð°Ñ ÐºÐ»ÐŸÐœ Gifski:
- Ðак кПМвеÑÑОÑПваÑÑ Ð²ÐžÐŽÐµÐŸ ÑÐ°Ð¹Ð»Ñ (.mp4 в .gif).
- Ðак ОÑпПлÑзПваÑÑ API Drag and Drop HTML.
- Ðак ÑабПÑаÑÑ ÐŸÐ¿ÑОЌОзаÑÐžÑ Ðž ПбÑабПÑка ОзПбÑажеМОй.
ášáááášááá: О еÑÑÑ ÐœÐ° GitHub!
5. ÐПМОÑПÑОМг кÑÑÑПв кÑОпÑПвалÑÑ
React Native cryptocurrency tracker
Ð§ÐµÐŒÑ Ð²Ñ ÐœÐ°ÑÑОÑеÑÑ, ÑÐŸÐ·ÐŽÐ°Ð²Ð°Ñ ÑÑÐµÐºÐµÑ ÐºÑÑÑа валÑÑ:
- Ðак ÑабПÑаÑÑ Ñ API О пПлÑÑаÑÑ ÐŽÐ°ÐœÐœÑе ÑЎалеММП Оз API.
- Ðак ПÑПбÑазОÑÑ ÐŽÐ°ÐœÐœÑе в вОЎе ÑпОÑка.
- áá áááá: ÐÑлО ваЌ ОМÑеÑеÑМП, Ñ ÐœÐµÐŽÐ°Ð²ÐœÐŸ МапОÑал Ма кÑОпÑПвалÑÑÑ Ñ React Native.
ášáááášááá: áᥠ.
ÐПЎбПÑка пÑПекÑПв Оз пÑеЎÑÐŽÑÑÐžÑ Ð¿ÑблОкаÑОй.
Layer
Layer áá áá¡ á¡áááááááááá, á¡ááá᪠á§ááááá¡ ášáá£á«ááá ááá®áá¢áá¡ ááá¥á¡ááá á¡ááá áá "ááá€ááá". áá ááááááá£á á áááá ááááááá Reddit-áá. r/Layer á¡áááááááááá áá áá¡ ááá¢áá€áá á á¡ááá áá ášáááá¥ááááááá¡áááá¡, á áá á§ááááá¡ ášáá£á«ááá áá§áá¡ ášáááá¥áááá áá á¬ááááá ášááá¢áááá¡ á¡ááá áá á¡áá¥ááášá.
á áá¡ áá¡á¬ááááá á¡ááá£ááá á Layer áá ááá¥á¢áá¡ ášáá¥áááá¡áá¡:
- á áááá áá£ášáááá¡ JavaScript á¢ááá á¢ááááá áá£ášááááá¡ áªáááá áá áá¢ááá£áá á£ááá áá áááá áááááááªááášá.
- á áááá ááááá®ááááá áááá®ááá ááááá¡ ááááá áááááá¡ áááá áááááªáá. áááááá£á áááá®ááá ááááá¡ ášáá£á«ááá ááá®áá¢áá¡ áá áá ááá¥á¡ááá á§áááá 15 á¬á£áášá á¡áá¡á¢áááášá ášáá¡áááá¡ ááá áášá.
- ášáá¥ááááá á¥á£á¥ááááá¡ á¡áá¡áááá.
Squoosh
Squoosh áá áá¡ ááááá¡áá®á£ááááá¡ ášááá£áášááá¡ áááááááªáá áá ááááá ááá¬ááááá ááá áááá¢áá.
GIF 20 áá
Squoosh-áá¡ á¡ááá£ááá á ááá á¡ááá¡ ášáá¥áááá áá¥ááá ášááá¡á¬ááááá:
- á áááá áááá£ášááá ááááá¡áá®á£ááááá¡ áááááááá
- ááááªáááá Drag'n'Drop API-á¡ á¡áá€á£á«ááááá¡
- áááááá á áááá áá£ášáááá¡ API áá áááááááááá¡ áá¡áááááááá
- á áááá áá¢ááá ááá áá áááá¢áááá á€áááááá
ášáááášááá: ááááá¡áá®á£ááááá¡ ááááá áá¡áá á áááááááá áááá. áá áá áá¡ á¡áááá á á¡áá ááá áá ááááá¢ááááá áááááªáááááá¡ áááááááá. áá¥ááá ášáááá«áááá ááááá áá¡áá á áá¥ááááá á¡áá®áášá, áá ášáááá«áááá áááááá§áááá áá¡ á¡áá ááá áá, áá¥áááá áá á©áááááá.
ááááá£ááá¢áá á
á²ááá? á¡áá áááá£ááá? ááááá£ááá¢áá á? áááá®, áá£á¡á¢áá, ááááá£ááá¢áá á. ááááááá¢ááá£á á áááá ááªááááá¡ á¡áá€á£á«áááááá¡ áááááá áá áááá áá ááááááá áá£ášááááá¡ áá áááªááá áá áá¡ áá áá¢ááá£áá á£ááá á áá¥áááá áááááááªááááá¡ ááá¡áááá á¢ááááááá. ááá á áᣠááááá ááááá¬ááá á¡áá¥áá áªáá€á ááááá áá á á᪠ááá á ááá á£ááááá¡á.
á¡ááá£ááá á ááááá£ááá¢áá áá¡ ášáá¥áááá áá¥ááá ášááá¡á¬ááááá:
- ááá£ášáááá á ááªá®áááááá áá ááááááá¢ááá£á ááá¥áááááááááá
- áááá á¯áášáá áááááááá¡ áá¡ááááááááá¡ API-á¡ááá áá ááá
- á áááá ááááá¬á§áá ááááááá¢ááá, ááááááá á¡á¢ááááá
ááªááªááá (á¡áá«áááá á¡áá¡á¢ááá)
á§ááááá áááááá§ááá á¡áá«áááá á¡áá¡á¢ááá, á áá¢áá áá ášáá¥áááá áá¥áááá? ááá€áá áááªááá¡ ááá¡áá«ááááá ááªááªáááá á¡áááá á. á§áááá áá§ááááá¡ ááá á§ááááááŠáá£á áá áá áá á¢áá¥ááááááááá áá á¡áááªááááá¡á¢áááá áááá®áááá áá®áááá áá ááá ááááááááááášá ááááá áááá.
Google á¡áá«áááá á¡áá¡á¢ááá
á áá¡ áá¡á¬ááááá á¡ááá£ááá á á¡áá«áááá á¡áá¡á¢áááá¡ ášáá¥áááá:
- á áááá áá£ášáááá¡ ááªááªááá
- á áááá ááááá®ááááá á¡ááá¢áááá¡ ááááá¥á¡áá ááá áá á áááá ááááá®áá áá¡á®áá áá¡ááá á ááá¢ááááá¡á áá á ááá£á¢ááªááá¡ ááá®ááááá
- á áááá ášááááá®áá ááááá¥á¡áá ááá£áá á¡ááá¢ááá áááááªáááá ááááášá áá á áááá áááá£ášááá áááááªáááá ááááá¡ááá
áá£á¡ááááá£á á ááááá á (Spotify, Apple Music)
á§áááá á£á¡áááá¡ áá£á¡áááá¡ - áá¡ áá®áááá á©áááá áªá®ááá áááá¡ áááá£á§áá€ááá ááá¬áááá. ááááá ášááá¥áááá áá£á¡ááááá£á á ááááá á, á ááá á£ááá ááááááá, á áááá áá£ášáááá¡ áááááááá ááá áá£á¡ááááá£á á ááááááá¡ áááá¢á€áá ááá¡ á«áá ááááá ááá¥ááááá.
Spotify
á áá¡ áá¡á¬ááááá áá¥áááá á¡ááá£ááá á áá£á¡áááá¡ ááááááá¡ áááá¢á€áá ááá¡ ášáá¥áááá:
- á áááá áááá£ášááá API-á¡ááá. áááááá§áááá API Spotify-ááá áá Apple Music-ááá
- á áááá ááááááášáá, ášááá©áá áá áá ááááá®ááááá ášááááá/á¬ááá á¢á áááá
- á áááá ášáááªááááá áááªá£áááá
- á áááá ááá ááá áááá®ááá ááááá¡ ááá ášá á£á¢ááááªáá áá áá áá£ááá áá¡ áá¡á¢áá áá
á€ááááááá¡ á¡áá«áááá ááá React-áá¡ ááááá§áááááá (áááááááá)
ááá áááá, á ááá᪠ášáááá«áááá áááá¬á§áá áá áá¡ á€ááááá¡ á¡áá«áááá áááá¡ ášáá¥ááá React-áá¡ ááááá§áááááá. á¥ááááá áááªááá£ááá á¡á£á ááá, áᣠá áááá áááááá§á£á ááá á¡áááááá áááááááªáá:
á áá¡ áá¡á¬áááá
áá áááááááªááá¡ ášáá¥áááá, áá¥ááá áááá£áá¯áááá¡ááá áá¥áááá¡ React á£ááá ááá¡ ášáááá áááá áá®ááá Hooks API-áá¡ ááááá§áááááá. ááááááááá¡ áá ááá¥á¢á áá§ááááá¡ React ááááááááá¢ááá¡, á£ááá áá ááá£áá¡, ááá á API-á¡ áá, á á áá¥áá á£ááá, CSS á¡á¢ááá¡.
á¢áá¥áááá£á á ááá¡á¢á áá ááá®áá¡ááááááááá
- á ááááá ááá áááááááá
- ášáá¥ááá-á ááááá ááá-áááááááªáá
- Jsx
- CSS
á§áááááááá á áááá¡áááá¡ ááááá§áááááá¡ ááá áášá, áá¡ áá ááá¥á¢ááá ááá«áááá ášáá¡áááášááá ášáá¡áááá¡ á¬áá á¢ááá¡ á€á£áá¥áªáááááá£á React-ášá áá áá£áªááááááá ááááá®ááá áááá 2020 á¬ááá¡. ášáááá«áááá áááááá . ááá°á§áááá ááá¡á¢á á£á¥áªáááá¡ áá áááááááá áá¡ á¡ááá£ááá á.
á©áá¢áá¡ áááááááªáá Vue-á¡ááá
ááááá áá áá ášáá¡áááášáááá áá ááá¥á¢á, á ááááá᪠á£ááá áááááááá, áá áá¡ á©áááá¡ áááá¡ ášáá¥ááá á©ááá á¡áá§ááá ááá JavaScript ááááááááááá¡ ááááá§áááááá: VueJS. áááááááªáá áá¡á áááááá§á£á ááá:
á áá¡ áá¡á¬áááá
áá áááááááááá áá¥ááá ášááá¡á¬ááááá áᣠá áááá á£ááá ášáá¥áááá Vue ááá áá£ááááá - ááááááááá¢áááá¡ ášáá¥ááá, ááááááá ááááá¡ áááá£ášááááá, ááá ášá á£á¢áááá¡ ášáá¥ááá, ááá¡ááá áá®áá áá¡ á¡áá ááá¡ááááá áááááášáá ááá áá áááááá¢áá€ááááªááá¡ ááá ááá᪠áá.
á¢áá¥áááá£á á ááá¡á¢á áá ááá®áá¡ááááááááá
- Vue
- vuex
- Vue á áá£á¢áá á
- Vue CLI
- Pusher
- CSS
áá¡ ááá ááá᪠ášáá¡áááášáááá áá ááá¥á¢áá Vue-á¡ ááá¡áá¬á§áááá áá áá¥áááá áá á¡ááá£áá á£ááá áááá¡ ááá¡áá£áá¯áááá¡ááááá, á ááá ášáá®ááááá áááááááá áááášá 2020 á¬ááá¡. ášáááá«áááá áááááá .
áášáááááá á ááááááá¡ áááááááªáá Angular 8-áá
áá¡ áááááááá ááááá®ááá áááá ášáá¥áááá áááááá ááááááá¡ áááááááªáá Angular 8-áá¡ ááááá§áááááá:
á áá¡ áá¡á¬áááá
áá¡ áá ááá¥á¢á ááá¡á¬ááááá áááááááªááááá¡ ášáá¥áááá¡ áááášáááááááá á£ááá ááá¡ áá£ááááá - áááááááááá áááá£ášáááááááá, áááááááááá¡áááá¡ ááá áááááááªááááá.
á¢áá¥áááá£á á ááá¡á¢á áá ááá®áá¡ááááááááá
- áá£áá®á£á á 8
- Firebase
- á¡áá ááá áá¡ á ááááá á
- CSS Grid-áá áá Flexbox-áá
- áááááá£á á áááááá á£áá áá ááááá¢áá ááááá
- áá£á¥á á ááááá
- áááááá ááá¢áá á€ááá¡á
á á᪠áá ááááááááá ááá§ááá á¡ áá á§ááááá¡ááááªááá áá ááá¥á¢ášá áá áá¡ áá¡, á áá áá¥ááá áá á¡á¬áááááá á¡áááááá¡ áááááá ááá£ááá. áááá¡ áááªáááá, áá¥ááá á¡á¬áááááá áááááááá áááá¡ áááá áá ááªáá¡á¡, áááááááááá á¡áááááá áááááááááááá.
ááá¡ááááááááá áááááááªáá Svelte-áá¡ ááááá§áááááá
Svelte á°áááá¡ áá®áá áááášáá¡ ááááááááá¢áááá ááá€á£á«áááá£áá áááááááá - á§áááá ášáááá®ááááášá áá¡áááá¡áá React, Vue áá Angular. áá áá¡ áá áá¡ áá á-áá áá á§áááááá áªá®ááá áá®ááá áá ááá£á¥á¢á 2020 á¬ááá¡áááá¡.
To-Do áááááááªáááá á¡á£áá᪠áá áá áá¡ á§áááááá áá¥á¢á£ááá£á á áááá, áááá áá áá¡ ááááááááá ááááá®ááá áááá áá¥áááá Svelte á£ááá áááá¡ ááá®ááá¬áášá. áá¡ áá¡á áááááá§á£á ááá:
á áá¡ áá¡á¬áááá
áá¡ ááááááááá ááá©áááááá, áᣠá áááá á£ááá ášáá¥áááá áááááááªáá Svelte 3-áá¡ ááááá§áááááá, ááááááá ááááááá. áá¥ááá áááááá§ááááá ááááááááá¢ááá¡, á¡á¢ááá¡ áá áŠáááá¡á«ááááááá¡ ááááá£ášáááááááá¡
á¢áá¥áááá£á á ááá¡á¢á áá ááá®áá¡ááááááááá
- Svelte 3
- ááááááááá¢ááá
- á¡á¢áááá¡á¢ááá CSS-áá
- ES 6 á¡ááá¢áá¥á¡á
áá áá áá¡ áááá á ááá áá Svelte-áá¡ áááá¬á§ááá áá ááá¥á¢á, áá¡á á áá ááŠááááá©ááá .
áááá¥á¢á ááá£áá ááááá áªááá¡ ááá Next.js-áá¡ ááááá§áááááá
Next.js áá áá¡ á§áááááá áááá£ááá á£áá á€á ááááá á React áááááááªááááá¡ ášáá¡áá¥áááááá, á áááááá᪠áá®áá á¡ á£ááá áá á¡áá ááá áá¡ áá®á áááá á ááááá áá áááá¡.
áá¡ áá ááá¥á¢á ááá©áááááá, áᣠá áááá á£ááá ášáá¥áááá áááá¥á¢á ááá£áá ááááá áªááá¡ áááááááªáá, á ááááá᪠áá¡á áááááá§á£á ááá:
á áá¡ áá¡á¬áááá
áá áá ááá¥á¢ášá áá¥ááá áá¡á¬ááááá á áááá áááááááá ááá Next.js-áá â ášáá¥ááááá áá®ááá áááá áááá áá ááááááááá¢ááá, áááááŠáá áááááªááááá áá áááááá¡á¢áááá áá ášáááááá áááááááªáá.
á¢áá¥áááá£á á ááá¡á¢á áá ááá®áá¡ááááááááá
- ášáááááá. Js
- ááááááááá¢ááá áá áááá áááá
- áááááªáááá ášáá á©ááá
- á¡á¢áááá¡
- áá ááá¥á¢áá¡ ááááááááá
- á¡á¡á áá á¡áá
á§áááááááá¡ áášáááááá áá, á áá áá¥ááááá¡ á áááá£á á áááááááá, á áááá ááªáá áááá¥á¢á ááá£áá ááááá áªááá¡ áááááááªáá, á áá áá¡á¬áááá á áááá áá®ááá. Ლáá ášáááá«ááá .
á¡á á£áá€áá¡ááááá áá ááááááááááá ááááá Nuxt.js-áá
Nuxt.js áá áá¡ Vue-á¡áááá¡, á á᪠áá áá¡ Next.js React-áá¡áááá¡: ášáá¡áááášáááá á©áá á©á á¡áá ááá áá¡ áá®á áááá á ááááá áá¡á áá áá ááááá ááááá áááááááªááááá¡ á¡ááá«áááá áá¡ áááá áááááááá¡áááá¡.
á¡áááááá áááááááªáá, á ááááá᪠ášáááá«áááá ášáá¥áááá, áá¡á áááááá§á£á ááá:
á áá¡ áá¡á¬áááá
áá áááá£áš áá ááá¥á¢ášá, áá¥ááá ášááá¡á¬ááááá áᣠá áááá ášáá¥áááá á¡á á£áá áááá¡ááá¢á Nuxt.js-áá¡ ááááá§áááááá, á¡áá¬á§áá¡á ááá§áááááááá á¡áááááá áááááááááááá.
áá¡ á¡áá ááááááá¡ áá ááááá ááááá á ááá®áá¡áááááááá, á á᪠Nuxt-á¡ á¡áááááááá¡, á áááá ááªáá áááá áááá áá ááááááááá¢ááá áá á¡á¢áááá¡á¢ááá SCSS-áá.
á¢áá¥áááá£á á ááá¡á¢á áá ááá®áá¡ááááááááá
- Nuxt.js
- ááááááááá¢ááá áá áááá áááá
- Storyblock áááá£áá
- á°ááá
- Vuex á¡áá®áááá¬áá€á ááá áááá¡áááá¡
- SCSS á¡á¢áááá¡áááá¡
- Nuxt Middlewares
, á ááááá᪠ááááªááá¡ Nuxt.js-áá¡ áááá ášáá¡áááášááá á€á£áá¥áªááá¡. áá ááá áááá ááá§ááá á¡ Nuxt-ááá áá£ášáááá, áá¡á á áá áá¥ááá á£ááá á¡áªáááá, á ááááá áá¡ áá¡ááá ááá®ááááá Vue-á¡ ááá ááááááááá áá.
ááááá ááá¢á¡ááá¡ááá áá ááá
ááá¢á¡áá áá áá¡ ášáá¡áááášáááá á¡á¢áá¢ááá£á á á¡ááá¢áá¡ ááááá áá¢áá á React-áá¡á áá GraphQL-áá¡ ááááá§áááááá. áá¡ áá áá¡ áá ááá¥á¢áá¡ ášááááá:
á áá¡ áá¡á¬áááá
áá áááááááááá áá¥ááá ášááá¡á¬ááááá áᣠá áááá áááááá§áááá ááá¢á¡áá áááááá¡ ášáá¡áá¥áááááá, á ááááá¡á᪠áááááá§ááááá á¡ááá£ááá á á¡á¢áá¢ááááá¡ ááá¡áá¬áá áá React-áá¡á áá GraphQL-áá¡ ááááá§áááááá.
á¢áá¥áááá£á á ááá¡á¢á áá ááá®áá¡ááááááááá
- áááªáááá
- á ááááá áááá¡
- GraphQL
- ááááááá¢ááá áá áááááá
- MDX/Markdown
- á©ááá¢ááá áááá CSS
- Templates
áᣠáááá¡áá áááááááá áááááá¡ ášáá¥ááá, áᣠá áááá á£ááá áááááááá áá¡ React-áá¡á áá GraphQL-áá¡ ááááá§áááááá.
áá áá áááááá, á áá WordPress áªá£áá áá á©áááááá, áááá áá ááá¢á¡ááá¡ á¡áášá£áááááá ášáááá«áááá ášáá¥áááá áááŠááá á®áá áá¡á®áá¡ áááá¡ááá¢ááá React-áá¡ ááááá§áááááá - á á᪠á¡áááªáá á ááááááááªááá.
ááááá Gridsome-ááá áá ááá
Gridsome for Vue... ááá áá, áá¡ á£ááá ááá¥áááá Next/Nuxt-áá.
áááá áá ááááá áá®ááá áá ááá¡ááá¡ áá ááá¢á¡ááá¡. áá ááá áá§ááááá¡ GraphQL-á¡, á áááá ᪠áááááªáááá á€áááá¡, áááá áá Gridsome áá§ááááá¡ VueJS-á¡. áá¡ áá áá¡ áá¡ááá á¡áááªáá á á¡á¢áá¢ááá£á á á¡ááá¢áá¡ ááááá áá¢áá á, á ááááá᪠ááááá®ááá áááá ášáá¥áááá ášáá¡áááášáááá ááááááá:
á áá¡ áá¡á¬áááá
áá¡ áá ááá¥á¢á ááá¡á¬ááááá á áááá ášáá¥áááá ááá á¢ááá ááááá Gridsome, GraphQL áá Markdown-áá¡ ááá¡áá¬á§áááá. áá¡ áá¡ááá ááááªááá¡, áᣠá áááá á£ááá áááááááá¡áá áááááááªáá Netlify-áá¡ á¡áášá£áááááá.
á¢áá¥áááá£á á ááá¡á¢á áá ááá®áá¡ááááááááá
- áá ááá¡ááá
- Vue
- GraphQL
- Markdown
- Netlify
áá¡, á á áá¥áá á£ááá, áá áá áá¡ á§áááááá á§ááááá¡ááááªáááá ááááááááá, áááá áá áá¡ ááááªááá¡ Gridsome-áá¡ á«áá áááá áªáááááá¡ áá .
SoundCloud-áá¡ áá¡áááá¡á áá£ááá ááááá á Quasar-áá¡ ááááá§áááááá
Quasar áá áá¡ ááááá áá áá Vue á©áá á©á, á ááááá᪠ášááá«áááá ááááá§ááááá£á áá¥ááá¡ áááááá£á á áááááááªááááá¡ ášáá¡áá¥áááááá. áá áá ááá¥á¢ášá áá¥ááá ášáá¥áááá áá£ááá ááááá áá¡ áááááááªááá¡, ááááááááá:
á áá¡ áá¡á¬áááá
ááá£á®áááááá áááá¡á, á áá á¡á®áá áá ááá¥á¢ááá á«áá áááááá ááá áááááááªáááááá á€ááá£á¡áá ááá£áá, áá¡ ááá©áááááá, áᣠá áááá á£ááá ášáá¥áááá áááááá£á á áááááááªáá Vue-á¡á áá Quasar Framework-áá¡ ááááá§áááááá.
áá¥ááá á£ááá á£ááá áá¥ááááá Cordova ááášáááá£áá Android Studio/Xcode-áá áááá€ááá£á áá ááá£áá. áᣠáá á, á¡áá®áááá«áŠááááááá¡ áá¥áá¡ ááá£áá Quasar áááá¡ááá¢áá, á¡ááá᪠áá¡ááá ááá©áááááá, áᣠá áááá á£ááá áááá§áááá á§ááááá€áá á.
á¢áá¥áááá£á á ááá¡á¢á áá ááá®áá¡ááááááááá
- ááááá á
- Vue
- Cordova
- WaveSurfer
- UI ááááááááá¢ááá
áá©áááá Quasar-áá¡ ášáá¡áá«ááááááááá áááááá£á á áááááááªááááá¡ ášáá¡áá¥áááááá.
ЀПÑЌа кÑеЎОÑМПй каÑÑÑ
ááááá á á¡ááá áááá¢á ááá áááá¡ á€áá áá ááá£áá áá á¡áá¡ááááááá áááá á á£á áááá áá¥ááááááá. ááááªááá¡ áááá áá¡ á€áá ááá¢áá áááá¡, ááááááá¬ááááá¡ áá ááá áááá¡ á¢áááá¡ ááá¢áááá¢á£á ááááªááááá¡. áá¡ ááááá£ááá Vue.js-áá áá áá¡ááá á¡á á£ááá á ááááá ááá¡. (Ლáááá«ááá ááá®á .)
á áá¡ áá¡á¬ááááá:
- á€áá ááááá¡ áááá£ášááááá áá ášáááá¬áááá
- áááááááááá¡ áááá£ášááááá (ááááááááá, á áááá¡á᪠ááªááááá áááááá)
- áááááá, á áááá á£ááá áá©ááááá áá áááááááá¡áá ááááááá¢ááá áááá ááá, áááá¡ááá£áá áááá á¡ááá áááá¢á ááá áááá¡ ááá€áá áááªáá, á ááááá᪠ááááá©ááááá á€áá ááá¡ ááááá
ááááá¡ áá áá€ááá
á°áá¡á¢ááá ááá áá áá¡ ááááá ááá áá ááááá ááá, á ááááá᪠á¬áá áááááááá¡ ááá¢áááá áá£á áááááªááááá¡ ááá ááá£áá®á ááááááá, á¡ááááŠááá áá á¡ááá á«áá, áá áááá áªáá£áá áááá á¬áá áááááááá áááášááááááááááá.
áá¡ááá ášááá«áááá ááááá§ááááá£á áá¥ááá¡ ááá á¢ááááá£á áá áá á°áá ááááá¢ááá£á áá. ááá á¢ááááá£á áááááá ááááá áááá¡ áááá¯áá á®áááááá ááááá áááá¡á᪠á£á¬áááááá.
á áá¡ áá¡á¬ááááá:
- áááááªáááááá¡ á©áááááá á¡á¢á á£á¥á¢á£á áá ááá£áá áá ááá¡áááááá
- ááááá¢áááá: áá¡á¬ááááá ááááááá¢áá¡ ááááá§ááááá
canvasáá á áááá áááá®áá¢áá ááááááá¢ááá ááá¡ááá
áá¥ááá ášáááá«áááá áááááá áá¡áá€ááá ááá¡áá®áááááá¡ áááááªááááá. áá¡ááá áááááááá£ááá á¬ááá¡ ááá®ááááá.
ÐМОЌаÑÐžÑ ÑеÑЎеÑка Twitter
á¯áá ááááá 2016 á¬ááá¡ Twitter-áá á¬áá áááááááá áá¡ á¡áááªáá á ááááááªáá ááááá¡á á¢ááá¢áááá¡áááá¡. 2019 á¬ááá¡ ááááááá ááááá, áá¡ á¯áá ááááá ááá¬áááá áááááá§á£á ááá, á áá¢áá áá ášáá¥áááá áá¡ ááááá?
á áá¡ áá¡á¬ááááá:
- ááá£ášáááá CSS áá¢á ááá£á¢áá
keyframes - HTML ááááááá¢áááá¡ áááááá£ááá ááá áá ááááááªáá
- ášáá£áááá¡áá JavaScript, HTML áá CSS
РепПзОÑПÑОО GitHub Ñ ÑÑМкÑОей пПОÑка
áᥠáá áá€áá áá áááááá - GitHub á¡ááªááááá áá®áááá ááááááááá£áá á¡ááá.
áááááá áá áá¡ á¡ááªáááááá¡ á©áááááá áá áááá®ááá ááááá¡ áááá ááá€ááá¢áá áá¡ á¡áášá£ááááá. ááááá§ááááá á áá ááááŠáá á¡ááªááá áááááá£áá áááá®ááá ááááá¡áááá¡.
GitHub áá áá€áááá¡ áááá áá -
á áá¡ áá¡á¬ááááá:
- ááááŠáá áááááªááááá API-ááá
- áááááªáááááá¡ á©áááááá API-ááá
- ááá€ááá¢á áá áá áá©ááááá ášáá¡áááááá¡á áááááªááááá áááááá£áá á«ááááá¡áááá¡
- á¡á£á ááááá¡ááááá : áᣠáá¥ááá áááá á®áá á ááááá¬ááááá¡áááá¡, áááááá§áááá , ááááá£ááá GraphQL-áá¡ ááááá§áááááá. .
ЧаÑÑ Ð² ÑÑОле Reddit
á©ááááá áááá£áááááªááá¡ áááá£ááá á£áá á¡áášá£áááááá áááá á¡áááá á¢áááá¡á áá ááááá§áááááá¡ á¡áááá á¢áááá¡ áááá. áááá áá á á ááá¬áááááá¡ á áááá£á áá áááááááá ááá á¡áá¡áá£áá á áááá®ááá¡? áááá¡áááá¢ááá!
á áá¡ áá¡á¬ááááá:
- áááááá§áááá WebSockets, á áááá£á áá áášá áááá£áááááªáá áá áááááªáááá ááááá®áááááá
- ááá£ášáááá áááá®ááá ááááá¡ á¬áááááá¡ ááááááááá (ááááááááá, á©áááá¡ áá á®áá¡ áá€áááááá¡ áá¥áá¡ á ááá
admináá á¡á®áááá áááá®ášá -user) - á€áá ááááá¡ áááá£ášááááá áá ááááááá¬áááá - ááá®á¡ááááá, ášáá¢á§áááááááá¡ ááááááááá¡ á©áá¢áá¡ á€ááá¯áá á áá áá¡
input - ášáá¥ááááá áá ášáá£áá áááá á¡á®ááááá¡á®áá á©ááááá¡
- ááá£ášáááá ááá áá ášáá¢á§ááááááááááá. áááá®ááá áááááá¡ ášáá£á«áááá á¡á®áá áááá®ááá áááááááá ááá ááá á¡áá£ááá á. áá á¡áááááá, áá¥ááá ááááá§áá ááá WebSocket áááášáá á¡ áá áááá®ááá ááááá¡ ášáá áá¡.
ÐавОгаÑÐžÑ Ð² ÑÑОле Stripe
á á᪠áá áááááááªááá¡ á£áááááá£á á¡ á®ááá¡ áá áá¡ áá¡, á áá ááááááá áá¡ áááá¢ááááá á ááá áááá¥ááááá áááá¢ááá¢ááá ášáá¡áááááá¡áááášá. áá ááááá¡áááá¡ áá¥áá¡ ááááááá¢á£á ááá áá®ááá ááááááá áá¡ ááá®á¡ááá¡á áá ááá®á£á ááá¡ á¢á ááááªáá£á á¥áªáááá¡ááá ášáááá áááá.
á áá¡ áá¡á¬ááááá:
- ášáá£áááá¡áá CSS ááááááªáááá ááááá¡ááááááá
- á©ááá¥á ááá ášááááá á¡á áá áááááá§áááá áá¥á¢áá£á á áááá¡á ááá«á áá ááááááá¢áá
Pacman
ášáá¥ááááá Pacman-áá¡ áá¥áááá á¡ááá£ááá á ááá á¡áá. áá¡ áá áá¡ ášáá¡áááášáááá ááá áááá¡ ááá¡áááááá, áᣠá áááá ááááá áááá ááááášááá áá áááááá á¡áá€á£á«ááááá. áááááá§áááá JavaScript á©áá á©á, React áá Vue.
áá¥ááá ášááá¡á¬ááááá:
- á áááá ááá«á ááááá ááááááá¢ááá
- á áááá ááááá¡áááŠáá áá á ááááá áŠáááááááá¡ ááááá á
- á áááá ááááá¡áááŠáá áá ášáá¯áá®áááá¡ áááááá¢á
- ášáááá«áááá á£á€á á ášáá á¡ á¬áá®ááááá áá áááááá¢áá ááá©ááááááááá¡ ááá«á ááááá¡ áááá¢á ááá
áá¥ááá ááá®ááá áá áá ááá¥á¢áá¡ áááááááá¡ GitHub
áááá®ááá ááááá¡ ááááá¯áááá¢á
áá ááá¥á¢á GitHub
áááá®ááá ááááá¡ ááááááá¡á¢á ááªááá¡áááá¡ CRUD á¢áááá¡ áááááááªááá¡ ášáá¥ááá ááá¡á¬ááááá áááááááá áááá¡ á¡áá€á£á«ááááá¡. áá¡ áááá¡ááá£áá áááá á¡áá¡áá áááááá áá®ááá ááááááááá áááá¡áááá¡.
áá¥ááá ášááá¡á¬ááááá:
- á á áá áá¡ ááá ášá á£á¢ááááªáá
- á áááá áááááá£ášááá áááááªáááá ášáá§ááááá¡ á€áá áááá áá ášááááá¬ááá á á ášááá§áááá áááá®ááá áááááá
- á áááá áááá£ášááá áááááªáááá ááááá¡ááá - ááá¥ááááááááá¡ ášáá¥ááá, á¬ááááá®áá, ááááá®áááá áá á¬áášáá
ÐÑПвеÑка Ð¿ÐŸÐ³ÐŸÐŽÑ Ð² ваÑеЌ ЌеÑÑПпПлПжеМОО
áá ááá¥á¢á GitHub
áᣠáá¡á£á á ášáá¥áááá áááááááªáááá, áááá¬á§áá ááááááá¡ áááááááªááá. áá¡ áá ááá¥á¢á ášááá«áááá ááá¡á á£áááá¡ Swift-áá¡ ááááá§áááááá.
áááááááªááá¡ ášáá¥áááá¡ áááááªááááááá¡ áááŠáááá¡ ááá áá, áá¥ááá ášááá¡á¬ááááá:
- á áááá áááá£ášááá API-á¡ááá
- á áááá ááááááá§áááá ááááááááªáá
- ááá®áááá áá¥áááá áááááááªáá á£á€á á ááááááá£á á á¢áá¥á¡á¢áá¡ ášáá§ááááá¡ ááááá¢áááá. ááá¡ášá áááá®ááá áááááá¡ ášááá«ááááá ášááá§ááááá áááááááá áááááá áááá ááááá áá¢á£á ááááááá¡ ááááááá¡ ášáá¡áááá¬áááááá.
áááááá ááááá API. ááááááá¡ áááááªáááááá¡ ááá¡ááŠáááá áááááá§áááá OpenWeather API. ááááá¢ááááá ááá€áá áááªáá OpenWeather API-áá¡ ášáá¡áá®áá.
ÐкМП ÑаÑа
á©ááá á©áá¢áá¡ á€ááá¯áá á ááá¥áááááá¡, ááá®á¡áááá áá áá£ááá áá¡ áá á©áááá áášá
á©áááá¡ á€ááá¯á áá¡ ášáá¥ááá ášáá¡áááášáááá áááá á¡áááá¢ááááá áá£ášááááá¡ ááá¡áá¬á§áááá. á¢áá¥áááá£á á á¡á¢áááá¡ áá á©ááááá ááááá. Node.js, ááááááááá, áááááá£á áá.
áá¥ááá ášááá¡á¬ááááá áᣠá áááá áá£ášáááá¡ á¡áááá¢ááá áá á áááá ááááá®áá áªááááá áá¡ááá. áá¡ áá áá¡ áá áá ááá¥á¢áá¡ áááááá á á£ááá áá¢áá¡ááá.
áᣠáá¥ááá á®áá á Laravel-áá¡ ááááááááá á, á ááááá¡á᪠á¡á£á á¡ á¡áááá¢ááááá áá£ášáááá, á¬áááááá®áá á©ááá
GitLab CI
áᣠáá¥ááá áá®ááá á®áá á á£á¬á§ááá¢á ááá¢ááá ááªááá¡áááá¡ (CI), áááááášáá GitLab CI-áá. áááá§áááá á áááááááá ááá ááá áá á¡áªáááá á áááááááá á¢áá¡á¢áá¡ ááášáááá. áá¡ áá áá áá¡ á«ááááá á áá£áá áá ááá¥á¢á, áááá áá ááá á¬áá£áááá£áá ááá , ááá¡ááá áááá á¡ áá¡á¬ááááá. áááá á áááááááá áááá¡ áá£ááá áá®áá áá§ááááá¡ CI-á¡. ááá¡á ááááá§áááááá¡ áªáááá á¡áá¡áá áááááá.
áá¥ááá ášááá¡á¬ááááá:
- á á áá áá¡ GitLab CI
- á áááá áááááááá€ááá£á áá áá
.gitlab-ci.ymlá ááááá᪠áá£ááááá GitLab-áá¡ áááá®ááá ááááá¡ á á á£ááá áááááááá¡ - á áááá ááááááááá¡áá á¡á®áá ááá áááášá
ÐМалОзаÑÐŸÑ ÑайÑПв
áááááááá á¡áá áááá á, á ááááá᪠áááááááááá¡ áááá¡ááá¢áááá¡ á¡ááááá¢áááá¡ áá á¥áááá¡ ááá á ááá¢áááá¡. ááááááááá, ášáááá«áááá ášááááá¬ááá ááááá¢ááááá£áá alt á¢ááááá á¡á£á ááááášá. áá ášááááá¬ááá áá¥áá¡ áᣠáá á áááá áá¡ SEO ááá¢á á¢ááááá. Scraper ášááá«áááá ášááá¥áááá¡ áááá®ááá ááááá¡ ááá¢áá á€ááá¡áá¡ ááá áášá.
áá¥ááá ášááá¡á¬ááááá:
- á áááá áá£ášáááá¡ á¡áá áááá á?
- á áááá ášááá¥áááá DOM á¡áááá¥á¢áá ááá
- á áááá áááá¬áá áá ááááá áááá
- áᣠáá áá¡á£á á áᥠááá©áá ááá, ášáá¥ááááá áááá®ááá ááááá¡ ááá¢áá á€ááá¡á. áá¥ááá áá¡ááá ášáááá«áááá ášáá¥áááá ááááá áášá áá¥áááá¡ áááá ášáááá¬áááá£á áááááá£á áááá¡ááá¢áá.
ÐпÑеЎелеМОе МаÑÑÑПеМОй в ÑПÑОалÑÐœÑÑ ÑеÑÑÑ
á¡ááá¢ááááá¢áááá¡ ááááááááá á¡ááªáááá£á áááááášá ášáá¡áááášáááá áááá áááá¥ááá£á á á¡á¬ááááá¡ ááá¡ááªááááá.
ášáááá«áááá áááá¬á§áá áá®áááá áá áá á¡ááªáááá£á á á¥á¡áááá¡ áááááááá. á§áááá á©ááá£áááá áá áá¬á§ááá Twitter-áá.
áᣠá£ááá ááá¥áá áááá¥ááá£á á á¡á¬ááááááá¡ áááááªáááááá, á¡áªáááá áááááªáááááá¡ ášááá ááááá á¡á®ááááá¡á®áá á¡ááªáááá£á á á¥á¡áááááááá áá áááá áááá ááááááá.
áá¥ááá ášááá¡á¬ááááá:
- á á áá áá¡ áááá¥ááááááªááááááá
ÐлПМ Trello
á áá¡ ááááááá:
- áááá®ááááá¡ áááá£ášáááááá¡ ááá ášá á£á¢áááá¡ áá áááááááªáá (Routing).
- ááááááá ááá áá á©áááááááá
- á áááá ášááá¥áááá áá®ááá ááááá¥á¢ááá (ááá€ááá, á¡áááá, ááá ááááá).
- ášáá§ááááá¡ áááááªáááááá¡ áááá£ášááááá áá ášáááá¬áááá.
- áááááá¢áá¡ áá®á áááá: á áááá ááááááá§áááá áááááá£á á ááá®á¡ááá ááá, á áááá ášááááá®áá áááááªááááá áááááá£á á¡ááªááášá, á áááá á¬ááááááá®áá áááááªááááá áááááá£á á á¡ááªáááááá.
- á¡áá ááá áá¡ áá®á áááá: á áááá ááááááá§áááá áááááªáááá áááááá, á áááá ášááááá®áá áááááªááááá áááááªáááá ááááášá, á áááá á¬ááááááá®áá áááááªááááá áááááªáááá ááááááá.
, ááááááááá£ááá React+Redux-ášá.
ÐÐ°ÐœÐµÐ»Ñ Ð°ÐŽÐŒÐžÐœÐ°
ááá á¢ááá CRUD áááááááªáá, áááááá£á áá á¡áá€á£á«áááááá¡ ášáá¡áá¡á¬ááááá. ááá¡á¬ááááá:
- ášáá¥ááááá áááá®ááá áááááá, ááá ááá áááá®ááá áááááá.
- áááááªáááá ááááá¡ááá á£á áááá áá¥áááááá - áááá®ááá ááááááá¡ ášáá¥ááá, á¬ááááá®áá, á áááá¥á¢áá ááá, á¬áášáá.
- ášáá§ááááá¡ ááááá¡á¢á£á ááá áá á€áá áááááá áá£ášáááá.
ТÑÐµÐºÐµÑ ÐºÑОпÑПвалÑÑ (МаÑОвМПе ЌПбОлÑМПе пÑОлПжеМОе)
á§ááááá€áá á: Swift, Objective-C, React Native, Java, Kotlin.
ááááá ááá¡á¬ááááá:
- á áááá áá£ášáááá¡ áášááááá£á á áááááááªáááá.
- á áááá ááááá«ááá áááááªááááá API-ááá.
- á áááá áá£ášáááá¡ áášááááá£á á áááá ááá¡ ááááááááá.
- á áááá áááá£ášááá áááááá£á á¢á áááááá ááááá.
. áᣠá ááá á£ááááá¡á¡ áááááá ááá¬áá áá áááááá¢áá ááášá.
áᣠááááá¢áá áá¡ááá, áᥠáá áá¡ .
ÐаÑÑÑПОÑÑ ÑПбÑÑвеММÑй кПМÑОг webpack Ñ ÐœÑлÑ
á¢áá¥áááá£á áá, áá¡ áá áá áá¡ áááááááªáá, áááá áá á«ááááá á¡áá¡áá ááááá ááááªáááá áááá¡ áááááá, áᣠá áááá áá£ášáááá¡ áááááááá¢á ášááááááá. áá®áá áá¡ áá áá¥áááá "ášááá á§á£áá", áá áááá ááá¡ááááá ááá¡á¢á á£áááá¢á.
áááá®áááááá:
- ášáááááááá es7-ááá es5-ááá (á¡áá€á£á«ááááá).
- jsx-áá¡ ášáááááá js - áá - .vue to .js-ášá (á©ááá¢ááá áááááááá¡ á¡á¬áááá ááááá¬ááá)
- áááá§áááá webpack ááááááááá áá¡ á¡áá ááá á áá áªá®ááá áááá£ááá¡ ááááá¢ááá ááá. (vue-cli áá create-react-app áá áááá¡ áá§áááááá)
- áááááá§áááá Heroku, now.sh áá Github, áá¡á¬ááááá á áááá áááááááá¡áá áááááááá¢áá¡ áá ááá¥á¢ááá.
- áááá§áááá áá¥áááá á¡áá§ááá ááá á¬áááá¡á¬áá á áá ááªáá¡áá á css-áá¡ ááááááááªááá¡áááá¡ - scss, less, á¡á¢ááá£á¡á.
- áá¡á¬ááááá á áááá áááááá§áááá á¡á£á ááááá áá svgs áááááááá¢áá.
ÐлПМ Hackernews
á§áááá á¯áááá¡ ááááá®ááááá á¡ááá£ááá á Hackernews-áá¡ ášáá¥ááá.
á áá¡ ááááááá ááááá:
- á áááá ááááá¥ááááá hackernews API-á¡ááá.
- á áááá ášááá¥áááá áá áá áááá ááááá áááááááªáá.
- á áááá áááááá®áá áªááááá áá¡ááá á€á£áá¥áªáááá, á áááá ááªáá áááááá¢áá áááá¡ ááá®áá, áááááááá£ááá£á á áááááá¢áá ááá, áá áá€ááááá.
- áááá®ááááá¡ áááá£ášáááááá¡ ááá ášá á£á¢áááá¡ áá áááááááªáá (Routing).
ТÑÐŽÑÑеÑка
á¡áá áááá£ááá? á¢á£áá£ášáá? áááá¡áááá áááááááá. áááá áá ááá á¬áá£ááá, áá áááá£ááá áááá¡ áááááá áá á¡ááááá¡.
Tudu ááá áá áá¡ ášáá¡áááášáááá ááá, á ááá ááá á¬áá£áááá, á áá ááá¡ááá á¡áá€á£á«ááááá. á¡áªáááá ááá¬áá áá áá áá áááááááªáá vanilla Javascript-ášá áá áá áá áá¥áááá¡ á¡áá§ááá áá á©áá á©áášá.
á²áá¡á¬ááááá:
- ášáá¥ááááá áá®ááá ááááªááááá.
- ášááááá¬ááá, á áá áááááá ášááá¡ááá£ááá.
- ááááªáááááá¡ ááá€ááá¢áá á (ááá¡á á£áááá£áá, áá¥á¢áá£á á, á§áááá). ááááá§ááááá
filterОreduce. - ááááá Javascript-áá¡ á¡áá€á£á«ááááá.
СПÑÑОÑÑеЌÑй drag and drop ÑпОÑПк
á«ááááá á¡áá¡áá áááááá ááá¡áááááá .
ááá¡á¬ááááá:
- ááááááá ááá áá á©áááááááá API
- ášáá¥ááááá áááááá á ááá¢áá á€ááá¡ááá
ÐлПМ ЌеÑÑеМЎжеÑа (МаÑОвМПе пÑОлПжеМОе)
áá¥ááá ááááááá, á áááá áá£ášáááá¡ á áááá ᪠ááá áááááááªáááá, áá¡ááá áášááááá£á á áááááááªáááá, á á᪠ááááááá á©ááá áááªá áá¡á€áá á ááá¡áá¡ááá.
á áá¡ ášáááá¡á¬ááááá:
- ááá á¡áááá¢ááá (áá§áá¡ááá á ášáá¢á§ááááááááá)
- á áááá áá£ášáááá¡ áášááááá£á á áááááááªáááá.
- á áááá áá£ášáááá¡ ášáááááááá áášááááá£á áááááááªáááášá.
- áááá®ááááá¡ áááá£ášáááááá¡ ááá ášá á£á¢áááá¡ áá áááááááá áášááááá£á áááááááªáááášá.
á²¢áá¥á¡á¢áá¡ á áááá¥á¢áá á
á¢áá¥á¡á¢á£á á á áááá¥á¢áá áá¡ ááááááá ášááááªáá áá¡ áááá®ááá ááááááá¡ á«áááá¡á®áááá, á áááááá᪠áªááááááá áááááááá á€áá ááá¢áá ááá HTML ááá ááá áááá áááááá¥áªááá. ááá áá á¢áá¥á¡á¢á£á á á áááá¥á¢áá á á¡áášá£áááááá¡ áá«áááá¡ áááá®ááá áááááá¡ á¢áá¥á¡á¢áá¡ á€áá ááá¢áá ááá á¡á®ááááá¡á®áá áááá.
á ááŠá᪠áááááá¢ášá, á§ááááá áááááá§ááá á¢áá¥á¡á¢áá¡ á áááá¥á¢áá á. á áá¢ááá᪠áá á ?
ÐлПМ Reddit
áá áá¡ á¡ááªáááá£á á áá®ááá ááááááá¡ ááá ááááªáá, ááá áááá¢ááá¢áá¡ á ááá¢áááá áá ááá¡áá£á¡ááá¡ á¡ááá¢á.
Reddit ááááááá¡ á©ááá áá ááá¡ á£ááá¢áá¡ ááá¬ááá¡, áááá áá áá áááá á«áááá ááá¡áá ááá¢áá áááá¡. Reddit-áá¡ áááááá¡ ášáá¥ááá áá ááá áááá áááá¡ á¡á¬ááááá¡ áá€áá¥á¢á£á á á¡áášá£áááááá (ááááá áá áá¡ Reddit-áá¡ ááááááááá áááá¡áá¡).
Reddit ááááááááá á«ááááá áááááá á¡. áá ááááá¢áááá á áááá ááá®áá¡áááááááá áá áá áááááááá á ááá ášáááá®ááááá. áááááá¢ááááá áá áááá®ááá áááááááá á áááá£á á¡ááá§áá áášá, áá¥ááá áá ášáááá«áááá ášáá£á€áá á®ááááá ááá£ášááá, áá á¡á¬á áá€áá ááááá áááá á¡ááá£ášááá¡.
ááááááá áááááá¢ááá ááášáááá ááá®ááááááá, á áá á¡áá¥áá áªá£ááá ááááááá áá á¡á®ááá¡ ááááááá.
ÐÑблОкаÑÐžÑ Ð¿Ð°ÐºÐµÑа NPM Ñ ÐŸÑкÑÑÑÑÐŒ ОÑÑ ÐŸÐŽÐœÑÐŒ кПЎПЌ
áᣠJavascript áááá¡ á¬áá á, áááá ááááááááá áá§ááááá ááááá¢áá¡ ááááá¯áá á¡. ááááá¢áá¡ ááááá¯áá á á¡áášá£áááááá¡ ááá«áááá á®áááá®áá áááááá§áááá áá á¡ááá£áá áááá, á ááááá᪠á¡á®áá ááááááááááá ááá¬áá áá¡ áá áááááá¥ááá§ááá¡.
ááááá¢áá¡ á¡á á£áá áááááááá áááá¡ áªááááá¡ áááááá á«ááááá ááá á áááááªááááááá¡ ááááªááá. áááá á á áá á£ááá ááªááá ááááá¡ ááááá¥ááá§ááááá¡áá¡. áá¥ááá á£ááá áá€áá¥á áá á£á¡áá€á áá®áááááá, á¡ááááá¢ááá£á ááá á¡áááá, ááá¡ášá¢ááá£á ááááá, ááá¡áá®áááááá¡ áááááááªááááá áá ášáááá á©á£áááááá.
ááááá¢á ášááá«áááá áá§áá¡ ááááá¡áááá á. áᣠáá ááá¥áá áááá, ášáá¥ááááá áá¥áááá á¡ááá£ááá á Lodash áá áááááá¥ááá§ááá ááá.
ááááášá:
áᣠá ááŠá᪠áááááááá áááááá, 10%-áá áááŠáá áá§ááááá á¡á®áááá¡. áŠáá á¬á§áá ááááá¡á áá ááááá¢áááá¡ ášáá¡áá®áá.
УÑебМÑй плаМ freeCodeCamp
freeCodecamp-áá áááá á ášáááá ááá .
freeCodeCamp áá áá¡ áá áááááá áªáá£áá áá áááááááªáá. ááá ášáááááá ááá¢áá áá¥á¢áá£áá ááá-áá ááá€á£á«áááá£áá á¡áá¡á¬áááá áááá¢á€áá ááá¡ááá, áááááá á¡ááááááááááá¡ á€áá á£ááá¡ááá, á©áá¢áá¡ áááá®áááá¡ááá, á¡áášá£ááá áá£ááááááªááááá¡ááá áá áááááááá ááá áá áááááááªááááá¡ááá, á áááááá᪠áááá áááá á¡á¬ááááá¡ ááá-áááááááá áááá¡ á§ááááá¡áááá¡ á®ááááá¡áá¬ááááá ááá®áááá.
áá¥ááá ááá¥ááááá ááá¢á áááááá€ááááªáá áá¥áááá ááá áááá á¡ááá£ášááá¡áááá¡, áᣠáááá®áá á®ááá ááááá áá£á á¡áá¡ ááá¡á á£ááááá¡.
СПзЎайÑе HTTP-ÑеÑÐ²ÐµÑ Ñ ÐœÑлÑ
HTTP áá áá¢ááááá áá áá¡ áá á-áá áá áááááá á áá áá¢ááááá, á ááááá¡ ááášááááááá᪠ášááááá á¡á áááááá£á ááá¡ ááá¢áá ááá¢ášá. HTTP á¡áá ááá ááá áááááá§ááááá á¡á¢áá¢ááá£á á ášááááá á¡áá¡ ááá¡ááá¡áá®á£á ááááá, á áááá ááªáá HTML, CSS áá JS.
HTTP áá áá¢áááááá¡ áá£ááááá ááááá áááá¡ ášáá¡áá«ááááááá áááá€áá áááááá¡ áá¥áááá¡ áªááááá¡ áááá¡ ášáá¡áá®áá, áᣠá áááá á£á áááá áá¥ááááááá á¡áááááá.
ááááááááá, áᣠáá§ááááá NodeJs, ááášáá ááªáá, á áá Express á£áá á£ááááá§áá€á¡ HTTP á¡áá ááá á¡.
áªááááá¡áááá¡, áá®áááá áᣠášáááá«áááá:
- áááá§áááá á¡áá ááá á á§áááááááá á ááááááááááá¡ ááááá§áááááá¡ ááá áášá
- á¡áá ááá á á£ááá ááááá¡áá®á£á áá¡ HTML, CSS áá JS áááá¢ááá¢á¡.
- á áá£á¢áá áá¡ ááááá ááá áá£ááááá
- áªáááááááááá¡ ááááá¢áá áááá áá á¡áá ááá áá¡ ááááá®áááá
áᣠáá ááªáá á áá¢áá, áááááá§áááá áá ášáááªáááá ášáá¥áááá HTTP á¡áá ááá á áá£ááááá.
ÐеÑкÑПпМПе пÑОлПжеМОе ÐŽÐ»Ñ Ð·Ð°ÐŒÐµÑПк
á©ááá á§áááá áááŠááá ášáááášááááá¡, áá á?
ááááá ášááá¥áááá ášáááášáááááá¡ áááááááªáá. áááááááªááá¡ á¡ááá áááá ášáááášáááááá¡ ášáááá®áá áá áááááªáááá ááááá¡ááá á¡ááá¥á ááááááªáá. ášáá¥ááááá áášááááá£á á áááááááªáá Electron-áá¡, Swift-áá¡ áá á á᪠áááá¬ááá áá á á᪠áá£ášáááá¡ áá¥áááá¡ á¡áá¡á¢ááááá.
ááááá áááááá ááááááášáá áá áá¡ ááá ááá ááááá¬ááááá¡ááá (á¢áá¥á¡á¢á£á á á áááá¥á¢áá á).
á áááá ᪠áááá£á¡á, á¡áªáááá áá¥áááá ááá¡áá¢áááá¡ ááá á¡ááá¡ á¡ááá¥á ááááááªáá ááá ááá á¡ááá¡ááá.
ÐПЎкаÑÑÑ (клПМ Overcast)
ááá áá á£á¡áááá¡ áááááá¡á¢ááá¡?
ášáá¥ááááá ááá áááááááªáá ášáááááá á€á£áá¥áªááááá:
- Ლáá¥ááááá ááááá áášá
- áááááá¡á¢áááá¡ á«áááá
- ášááá€áá¡áá áá áááááá¬áá áá áááááá¡á¢á
- áááá©áá áá áá áááááášáá, ášááªááááá á¡áá©á¥áá á, á¬áá áá á£ááá á€á£áá¥áªáááá 30 á¬áááá¡ ááááááááááášá.
á¡áªáááá áááááá§áááá iTunes API, á áááá ᪠á¡áá¬á§áá¡á á¬áá á¢ááá. áᣠááªáá á áááá á¡á®áá á áá¡á£á á¡á, ááá®ááá ááá¬áá áá áááááá¢áá ááášá.
ááá áááá¡ áááááŠááá
ááááá á¯ááá! áá®áááá áááŠáá á©ááá¡ ááá ááá¡!
ášáá¥ááááá ááá¡áá¢áááá¡ áá ááá ááá, á ááááá᪠á¡áášá£áááááá¡ ááá«áááá ááááááŠáá áá¥áááá ááá ááá áá ášááááá®áá ááááá á áááá ᪠.gif
áᥠá áááá áááááŠá¬ááá áááá¡.
ááá€áá áááªááá¡ á¬á§áá áááá
á¬á§áá á: www.habr.com