1. Клон Notion
Приложение Notion полюбилось многим, оно позволяет оптимизировать рабочий процесс, работать с документами, планировать задачи, синхронизировать данные между устройствами.
Чему вы научитесь, создавая клон Notion:
- . Пользователь может «схватить мышкой» draggable элемент и поместить его в droppable зону.
- Как синхронизировать в режиме реального времени данные между компьютером и смартфоном.
- Мы позволяем пользователям создавать, читать, обновлять и удалять записи, тем самым мы тренируем CRUD-навыки.
L-artiklu ġie tradott bl-appoġġ ta 'EDISON Software, li U .
2. Клон Repl.it
Repl.it -это инструмент для совместного редактирования кода в реальном времени. Можно выбрать несколько языков: JavaScript, Python, Go и выполнять код прямо в браузере. Очень полезно для быстрых демонстраций и код-интервью.
Чему вы научитесь, создавая клон Repl.it:
- Как запускать и выполнять код (server-side) в браузере (client-side).
- Считывать входные данные (исходный код) и выводить на экран результат выполнения.
- Как создавать файлы и папки в вебе и сохранять результаты.
- Как подсвечивать синтаксис кода.
3. Клон Google Photos
Google Photos это сервис для хранения и обмена фоток.
Любое современное приложение по работе с фотографиями умеет выполнять базовые функции: загружать, обрезать и пр. Люди хотят создавать свои аватарки и делиться фотками котиков, поэтому надо уметь работать с изображениями.
Чему вы научитесь, создавая клон Google Photos:
- Как создавать адаптивные изображения на телефонах, планшетах, ноутбуках и даже на гигантских экранах телевизоров.
- Как обрабатывать загрузку изображений, особенно больших изображений (>1МБ) и массовых загрузок.
- Обработка файлов изображений, обрезка и изменение размера фотографий для миниатюр или при открытии галереи.
- Bonus: как хранить изображения в облаке или локальной базе данных.
4. Клон Gifsky
конвертирует видео в GIF используя функции для эффективных палитр кросс-кадров и временного сглаживания. В результате получается гифка с тысячами цветов на кадр.
Чему вы научитесь, создавая клон Gifski:
- Как конвертировать видео файлы (.mp4 в .gif).
- Как использовать API Drag and Drop HTML.
- Как работают оптимизация и обработка изображений.
Nota: и есть на GitHub!
5. Мониторинг курсов криптовалют
React Native cryptocurrency tracker
Чему вы научитесь, создавая трекер курса валют:
- Как работать с API и получать данные удаленно из API.
- Как отобразить данные в виде списка.
- Bonus: Если вам интересно, я недавно написал на криптовалюту с React Native.
Nota: Hawnhekk .
Подборка проектов из предыдущих публикаций.
saff
Saff huwa komunità fejn kulħadd jista 'jiġbed pixel fuq "bord" kondiviż. L-idea oriġinali twieldet fuq Reddit. Il-komunità r/Layer hija metafora għall-kreattività kondiviża, li kulħadd jista 'jkun kreatur u jikkontribwixxi għal kawża komuni.
Dak li se titgħallem meta toħloq il-proġett tas-Saff tiegħek stess:
- Kif jaħdem il-kanvas JavaScript Li tkun taf kif tħaddem tila hija ħila kritika f'ħafna applikazzjonijiet.
- Kif tikkoordina l-permessi tal-utent. Kull utent jista' jiġbed pixel wieħed kull 15-il minuta mingħajr ma jkollu għalfejn jidħol.
- Oħloq sessjonijiet tal-cookie.
Squoosh
Squoosh hija applikazzjoni għall-kompressjoni tal-immaġni b'ħafna għażliet avvanzati.
GIF 20 MB
Billi toħloq il-verżjoni tiegħek ta' Squoosh inti titgħallem:
- Kif taħdem b'daqsijiet tal-immaġini
- Tgħallem l-affarijiet bażiċi tal-API Drag'n'Drop
- Ifhem kif jaħdmu l-API u s-semmiegħa tal-avvenimenti
- Kif ittella' u tesporta fajls
Nota: Il-kompressur tal-immaġni huwa lokali. Mhuwiex meħtieġ li tibgħat data addizzjonali lis-server. Jista 'jkollok il-kompressur id-dar, jew tista' tużah fuq server, l-għażla tiegħek.
Kalkulatur
Ejja? Serjament? Kalkulatur? Iva, eżattament, kalkolatur. Il-fehim tal-baŜi tal-operazzjonijiet tal-matematika u kif jaħdmu flimkien hija ħila kritika biex tissimplifika l-applikazzjonijiet tiegħek. Illum jew għada jkollok tittratta n-numri u aktar ma jkun kmieni aħjar.
Billi toħloq il-kalkolatur tiegħek inti titgħallem:
- Xogħol bin-numri u l-operazzjonijiet tal-matematika
- Prattika mal-API tas-semmiegħa tal-avvenimenti
- Kif tirranġa l-elementi, tifhem l-istili
Tkaxkir (magna tat-tiftix)
Kulħadd uża magna tat-tiftix, allura għaliex ma toħloqx tiegħek? It-tkaxkir huma meħtieġa biex ifittxu informazzjoni. Kulħadd jużahom kuljum u d-domanda għal din it-teknoloġija u speċjalisti se tikber biss maż-żmien.
Google search engine
Dak li se titgħallem billi toħloq il-magna tat-tiftix tiegħek stess:
- Kif jaħdmu t-tkaxkir
- Kif tindika s-siti u kif tikklassifikahom skont il-klassifikazzjoni u r-reputazzjoni
- Kif taħżen siti indiċjati f'database u kif taħdem mad-database
Plejer tal-mużika (Spotify, Apple Music)
Kulħadd jisma’ l-mużika – hija biss parti integrali minn ħajjitna. Ejja noħolqu plejer tal-mużika biex nifhmu aħjar kif jaħdmu l-mekkaniżmi bażiċi ta 'pjattaforma moderna ta' streaming tal-mużika.
Spotify
Dak li se titgħallem billi toħloq il-pjattaforma ta' streaming tal-mużika tiegħek stess:
- Kif taħdem mal-API. uża API minn Spotify jew Apple Music
- Kif tilgħab, tieqaf jew terġa 'lura għall-binarju li jmiss/preċedenti
- Kif tibdel il-volum
- Kif timmaniġġja r-rotot tal-utent u l-istorja tal-browser
App għat-tfittxija tal-films billi tuża React (bil-ganċijiet)
L-ewwel ħaġa li tista 'tibda biha hija li toħloq app ta' tfittxija ta 'films billi tuża React. Hawn taħt hawn immaġni ta' kif se tidher l-applikazzjoni finali:
X'titgħallem
Billi tibni din l-app, int se ttejjeb il-ħiliet ta' React tiegħek billi tuża l-API Hooks relattivament ġdida. Il-proġett eżempju juża komponenti React, lottijiet ta 'ganċijiet, API esterna, u ovvjament xi stil CSS.
Munzell ta 'teknoloġija u karatteristiċi
- Irreaġixxi bil-ganċijiet
- Oħloq-tirreaġixxi-app
- Jsx
- CSS
Mingħajr ma tuża l-ebda klassijiet, dawn il-proġetti jagħtuk il-punt ta 'dħul perfett f'React funzjonali u żgur li se jgħinuk fl-2020. tista ssib . Segwi l-istruzzjonijiet jew għamilha tiegħek.
Chat App ma Vue
Proġett ieħor kbir għalik li tagħmel huwa li toħloq app chat billi tuża l-librerija favorita tiegħi JavaScript: VueJS. L-applikazzjoni se tidher xi ħaġa bħal din:
X'titgħallem
F'dan it-tutorja, int ser titgħallem kif tagħmel app Vue mill-bidu - toħloq komponenti, timmaniġġja l-istat, toħloq rotot, tikkonnettja ma 'servizzi ta' partijiet terzi, u anke timmaniġġja l-awtentikazzjoni.
Munzell ta 'teknoloġija u karatteristiċi
- Vue
- vuex
- Vue Router
- Vue CLI
- Irmonk
- CSS
Dan huwa proġett tassew kbir biex tibda bil-Vue jew ittejjeb il-ħiliet eżistenti tiegħek biex tidħol fl-iżvilupp fl-2020. tista ssib .
App tat-temp sabiħa b'Angular 8
Dan l-eżempju jgħinek toħloq app tat-temp sabiħa billi tuża Angular 8:
X'titgħallem
Dan il-proġett se jgħallemkom ħiliet siewja fil-bini ta’ applikazzjonijiet mill-bidu – mid-disinn sa l-iżvilupp, sat-triq kollha għal applikazzjoni lesta għall-iskjerament.
Munzell ta 'teknoloġija u karatteristiċi
- Angolari 8
- Firebase
- Rendiment tan-naħa tas-server
- CSS bi Grid u Flexbox
- Mobbli faċli u adattabilità
- Modalità skura
- Interfaċċja sabiħa
Dak li verament inħobb dwar dan il-proġett li jinkludi kollox huwa li ma tistudjax l-affarijiet b'mod iżolat. Minflok, titgħallem il-proċess kollu ta 'żvilupp, mid-disinn sal-iskjerament finali.
To-Do applikazzjoni bl-użu ta 'Svelte
Svelte huwa bħall-kid il-ġdid fuq l-approċċ ibbażat fuq il-komponenti - għall-inqas simili għal React, Vue u Angular. U dan huwa wieħed mill-aktar prodotti ġodda sħan għall-2020.
L-applikazzjonijiet To-Do mhumiex neċessarjament l-aktar suġġett jaħraq, iżda tassew jgħinek ttejjeb il-ħiliet Svelte tiegħek. Se tidher bħal din:
X'titgħallem
Dan it-tutorja jurik kif toħloq applikazzjoni billi tuża Svelte 3, mill-bidu sat-tmiem. Int ser tuża komponenti, stil, u handlers tal-avvenimenti
Munzell ta 'teknoloġija u karatteristiċi
- Svelta 3
- Komponenti
- Styling b'CSS
- ES 6 sintassi
M'hemmx ħafna proġetti tajbin ta 'starter Svelte, għalhekk sibt .
App tal-kummerċ elettroniku li tuża Next.js
Next.js huwa l-aktar qafas popolari għall-bini ta’ applikazzjonijiet ta’ React li jappoġġjaw ir-rendiment min-naħa tas-server barra mill-kaxxa.
Dan il-proġett jurik kif toħloq applikazzjoni tal-kummerċ elettroniku li tidher bħal din:
X'titgħallem
F'dan il-proġett, int ser titgħallem kif tiżviluppa b'Next.js—oħloq paġni u komponenti ġodda, estratti dejta, u stil u tiskjera applikazzjoni Next.
Munzell ta 'teknoloġija u karatteristiċi
- Next.js
- Komponenti u Paġni
- Teħid ta' kampjuni tad-dejta
- Styling
- Skjerament tal-Proġett
- SSR u SPA
Dejjem tajjeb li jkollok eżempju fid-dinja reali bħal app tal-kummerċ elettroniku biex titgħallem xi ħaġa ġdida. Tista .
Blog multilingwi sħiħ b'Nuxt.js
Nuxt.js huwa għal Vue, dak li Next.js huwa għal React: qafas kbir biex tgħaqqad il-qawwa tar-rendiment fuq is-server u applikazzjonijiet b'paġna waħda
L-applikazzjoni finali li tista' toħloq se tidher bħal din:
X'titgħallem
F'dan il-proġett ta 'kampjun, int ser titgħallem kif toħloq websajt kompluta bl-użu ta' Nuxt.js, mis-setup inizjali sal-iskjerament finali.
Huwa jieħu vantaġġ minn ħafna mill-karatteristiċi friski li għandha x'toffri Nuxt, bħal paġni u komponenti, u stil bl-SCSS.
Munzell ta 'teknoloġija u karatteristiċi
- Nuxt.js
- Komponenti u Paġni
- Modulu Storyblock
- Ħagfish
- Vuex għall-ġestjoni tal-istat
- SCSS għall-grafika
- middlewares Nuxt
, li jinkludi ħafna karatteristiċi kbar ta' Nuxt.js. Jien personalment inħobb naħdem ma' Nuxt għalhekk għandek tipprovaha peress li tagħmlek ukoll żviluppatur kbir ta' Vue.
Blog ma' Gatsby
Gatsby huwa ġeneratur ta 'sit statiku eċċellenti li juża React u GraphQL. Dan huwa r-riżultat tal-proġett:
X'titgħallem
F'dan it-tutorja, int ser titgħallem kif tuża Gatsby biex toħloq blog li int ser tuża biex tikteb l-artikoli tiegħek billi tuża React u GraphQL.
Munzell ta 'teknoloġija u karatteristiċi
- gatsby
- Irreaġixxi
- GraphQL
- Plugins u temi
- MDX/Markdown
- Bootstrap CSS
- templates
Jekk qatt xtaqt tibda blog, dwar kif tagħmilha billi tuża React u GraphQL.
Mhux qed ngħid li WordPress hija għażla ħażina, iżda b'Gatsby tista' tibni websajts ta' prestazzjoni għolja billi tuża React - li hija taħlita tal-għaġeb.
Blog ma' Gridsome
Gridsome għal Vue... Okay, diġà kellna dan ma Next/Nuxt.
Iżda l-istess jgħodd għal Gridsome u Gatsby. It-tnejn jużaw GraphQL bħala saff tad-dejta tagħhom, iżda Gridsome juża VueJS. Dan huwa wkoll ġeneratur ta 'sit statiku aqwa li jgħinek toħloq blogs mill-aqwa:
X'titgħallem
Dan il-proġett se jgħallem kif toħloq blog sempliċi biex tibda ma 'Gridsome, GraphQL u Markdown. Tkopri wkoll kif tiskjera applikazzjoni permezz ta' Netlify.
Munzell ta 'teknoloġija u karatteristiċi
- Gridsome
- Vue
- GraphQL
- Markdown
- Netlify
Dan ċertament mhuwiex l-aktar tutorja komprensiva, iżda jkopri l-kunċetti bażiċi ta 'Gridsome u .
Awdjo player bħal SoundCloud li juża Quasar
Quasar huwa qafas Vue ieħor li jista' jintuża biex jinħolqu applikazzjonijiet mobbli. F'dan il-proġett inti se toħloq applikazzjoni tal-awdjo player, pereżempju:
X'titgħallem
Filwaqt li proġetti oħra jiffokaw prinċipalment fuq applikazzjonijiet tal-web, dan jurik kif toħloq applikazzjoni mobbli bl-użu ta' Vue u l-qafas Quasar.
Diġà għandu jkollok Cordova taħdem b'Android Studio/Xcode konfigurat. Jekk le, il-manwal għandu link għall-websajt tal-Quasar fejn juruk kif twaqqaf kollox.
Munzell ta 'teknoloġija u karatteristiċi
- quasar
- Vue
- Cordova
- WaveSurfer
- Komponenti UI
, li juri l-kapaċitajiet ta' Quasar għall-ħolqien ta' applikazzjonijiet mobbli.
Форма кредитной карты
Forma ta 'karta ta' kreditu friska b'mikro-interazzjonijiet bla xkiel u pjaċevoli. Jinkludi l-ifformattjar tan-numri, il-verifika u s-sejbien awtomatiku tat-tip tal-karta. Hija mibnija fuq Vue.js u hija wkoll tirrispondi bis-sħiħ. (Inti tista tara .)
Dak li ser titgħallem:
- Ipproċessa u tivvalida l-formoli
- Immaniġġja l-avvenimenti (pereżempju, meta l-oqsma jinbidlu)
- Ifhem kif turi u tpoġġi elementi fuq il-paġna, speċjalment l-informazzjoni tal-karta tal-kreditu li tidher fuq il-formola
bar chart
Istogramma hija chart jew graff li tirrappreżenta data kategorika b'vireg rettangolari b'għoli jew tul proporzjonali għall-valuri li jirrappreżentaw.
Jistgħu jiġu applikati vertikalment jew orizzontalment. A bar chart vertikali kultant tissejjaħ line chart.
Dak li ser titgħallem:
- Uri d-dejta b'mod strutturat u li jinftiehem
- Barra minn hekk: Tgħallem kif tuża l-element
canvasu kif tiġbed elementi magħha
tista' ssib data dwar il-popolazzjoni dinjija. Dawn huma magħżula skond is-sena.
Анимация сердечка Twitter
Lura fl-2016, Twitter introduċa din l-animazzjoni aqwa għat-tweets tagħha. Mill-2019, għadu jidher il-parti, allura għaliex ma toħloqx waħda lilek innifsek?
Dak li ser titgħallem:
- Xogħol bl-attribut CSS
keyframes - Manipula u janima elementi HTML
- Għaqqad JavaScript, HTML u CSS
Репозитории GitHub с функцией поиска
M'hemm xejn fancy hawn—repożitorji GitHub huma biss lista glorifikata.
L-għan huwa li juri r-repożitorji u jippermetti lill-utent jiffiltrahom. Użu biex tikseb repożitorji għal kull utent.
Paġna tal-profil GitHub -
Dak li ser titgħallem:
- Irċievi data mill-API
- Uri dejta mill-API
- Iffiltra u uri d-dejta rilevanti għal kull tfittxija
- Fakultattiv: Jekk int għal sfida, uża , mibnija bl-użu ta 'GraphQL. .
Чаты в стиле Reddit
Iċ-chats huma mod popolari ta’ komunikazzjoni minħabba s-sempliċità u l-faċilità ta’ użu tagħhom. Imma x'inhu verament fjuwils chat rooms moderni? WebSockets!
Dak li ser titgħallem:
- Uża WebSockets, komunikazzjoni f'ħin reali u aġġornamenti tad-dejta
- Aħdem mal-livelli ta 'aċċess għall-utent (per eżempju, is-sid ta' kanal ta 'chat għandu r-rwol
admin, u oħrajn fil-kamra -user) - Ipproċessa u vvalida formoli - ftakar, it-tieqa taċ-chat biex jintbagħat messaġġ hija
input - Oħloq u ingħaqad ma' chats differenti
- Aħdem b'messaġġi personali. L-utenti jistgħu chat ma' utenti oħra privatament. Essenzjalment, tkun qed tistabbilixxi konnessjoni WebSocket bejn żewġ utenti.
Навигация в стиле Stripe
Dak li jagħmel din in-navigazzjoni unika huwa li l-kontenitur popover jittrasforma biex joqgħod mal-kontenut. Hemm eleganti għal din it-tranżizzjoni meta mqabbla ma 'l-imġieba tradizzjonali tal-ftuħ u l-għeluq ta' popover ġdid.
Dak li ser titgħallem:
- Għaqqad animazzjonijiet CSS ma 'tranżizzjonijiet
- Iddgħajjef il-kontenut u applika klassi attiva għal element floated
Pacman
Создайте свою версию Pacman. Это отличный способ получить представление о том, как разрабатываются игры, понять основы. Используйте JavaScript-фреймворк, React или Vue.
Int titgħallem:
- Как передвигаются элементы
- Как определить какие клавиши нажимать
- Как определить момент столкновения
- Вы можете не останавливаться на достигнутом и добавить управление движением призраков
Пример этого проекта вы найдете GitHub
ġestjoni tal-utenti
Proġett GitHub
Создание приложения типа CRUD для администрирования пользователей научит вас основам разработки. Это особенно полезно начинающим разработчикам.
Int titgħallem:
- Что такое маршрутизация
- Как обращаться с формами для ввода данных и проверять что ввел пользователь
- Как работать с базой данных — создавать, читать, обновлять и удалять действия
Проверка погоды в вашем местоположении
Proġett GitHub
Если вы хотите создавать приложения, начните с приложения определения погоды. Этот проект можно выполнить с использованием Swift.
Помимо получения опыта по созданию приложения, вы узнаете:
- Как работать с API
- Как использовать геолокацию
- Cделайте приложение более динамичным, добавив текстовый ввод. В нем пользователи смогут ввести свое местоположение, чтобы проверить погоду в определенном месте.
Вам понадобится API. Для получения данных о погоде используйте API OpenWeather. Больше информации об API OpenWeather.
Окно чата
Мое окно чата в действии, открытое в двух вкладках браузера
Создание окна чата это идеальный способ начать работу с сокетами. Выбор технического стека огромен. Отлично подойдет Node.js, например.
Вы узнаете, как работают сокеты и как их реализовать. Это главное преимущество этого проекта.
Если вы разработчик Laravel, который хочет работать с сокетами, прочитайте мою
GitLab CI
Если вы новичок в непрерывной интеграции (CI), поиграйтесь с GitLab CI. Настройте несколько сред и попробуйте запустить пару тестов. Это не очень сложный проект, но я уверен, что вы многому научитесь благодаря ему. Многие команды разработчиков в настоящее время используют CI. Уметь им пользоваться полезно.
Int titgħallem:
- Что такое GitLab CI
- Как сконфигурировать
.gitlab-ci.yml, который говорит пользователю GitLab, что делать - Как деплоить в других средах
Анализатор сайтов
Сделайте скрапер, который анализирует семантику веб-сайтов и создает их рейтинг. Например, вы можете проверить наличие недостающих alt-тегов на изображениях. Или проверить есть ли на странице мета теги SEO. Скрапер можно создать и без пользовательского интерфейса.
Int titgħallem:
- Как работает скрапер
- Как создавать DOM селекторы
- Как писать алгоритм
- Если не хотите останавливаться на достигнутом, создайте пользовательский интерфейс. Можно также составить отчет о каждом проверенном вами веб-сайте.
Определение настроений в социальных сетях
Определение настроений в социальных сетях это отличный способ познакомиться с машинным обучением.
Вы можете начать с анализа только одной социальной сети. Обычно все начинают с Twitter.
Если у вас уже есть опыт работы с машинным обучением, попытайтесь собрать данные разных социальных сетей и объединить их.
Int titgħallem:
- Что представляет из себя машинное обучение
Клон Trello
Dak li se titgħallem:
- Organizzazzjoni tar-rotot tal-ipproċessar tat-talbiet (Routing).
- Iddreggja u qiegħed.
- Kif toħloq oġġetti ġodda (bordijiet, listi, karti).
- Ipproċessar u verifika tad-dejta tal-input.
- Min-naħa tal-klijent: kif tuża l-ħażna lokali, kif tiffranka d-dejta fil-ħażna lokali, kif taqra d-dejta mill-ħażna lokali.
- Min-naħa tas-server: kif tuża databases, kif tiffranka d-data fid-database, kif taqra data mid-database.
, magħmul f'React+Redux.
Панель админа
Applikazzjoni CRUD sempliċi, ideali biex titgħallem l-affarijiet bażiċi. Ejja nitgħallmu:
- Oħloq utenti, immaniġġja l-utenti.
- Interazzjoni mad-database - oħloq, aqra, editja, ħassar utenti.
- Il-validazzjoni tal-input u l-ħidma bil-formoli.
Трекер криптовалют (нативное мобильное приложение)
Xejn: Swift, Objective-C, React Native, Java, Kotlin.
Ejja nistudjaw:
- Kif jaħdmu l-applikazzjonijiet indiġeni.
- Kif tirkupra data mill-API.
- Kif jaħdmu t-tqassim tal-paġni indiġeni.
- Kif taħdem ma 'simulaturi mobbli.
. Jekk issib xi ħaġa aħjar, ikteb fil-kummenti.
Jekk int interessat, hawn hu .
Настроить собственный конфиг webpack с нуля
Teknikament, din mhix applikazzjoni, iżda hija kompitu utli ħafna biex tifhem kif taħdem il-webpack minn ġewwa. Issa mhux se tkun "kaxxa sewda", iżda għodda li tinftiehem.
Rekwiżiti:
- Ikkompila es7 sa es5 (baŜi).
- Ikkompila jsx għal js - jew - .vue għal .js (ser ikollok titgħallem loaders)
- Twaqqaf webpack dev server u hot module reloading. (vue-cli u create-react-app jużaw it-tnejn)
- Uża Heroku, now.sh jew Github, tgħallem kif tuża proġetti webpack.
- Stabbilixxi l-preprocessor favorit tiegħek biex tiġbor css - scss, less, stylus.
- Tgħallem kif tuża immaġini u svgs mal-webpack.
Клон Hackernews
Kull Jedi huwa meħtieġ li jagħmel il-Hackernews tiegħu stess.
Dak li se titgħallem tul it-triq:
- Kif jinteraġixxi mal-hackernews API.
- Kif toħloq applikazzjoni ta' paġna waħda.
- Kif timplimenta karatteristiċi bħall-wiri ta 'kummenti, kummenti individwali, profili.
- Organizzazzjoni tar-rotot tal-ipproċessar tat-talbiet (Routing).
Тудушечка
Serjament? Tudushka? Hemm eluf minnhom. Imma emminni, hemm raġuni għal din il-popolarità.
L-app Tudu hija mod tajjeb ħafna biex tiżgura li tifhem l-affarijiet bażiċi. Ipprova ikteb applikazzjoni waħda fil-vanilla Javascript u waħda fil-qafas favorit tiegħek.
Tgħallem:
- Oħloq kompiti ġodda.
- Iċċekkja li l-oqsma huma mimlija.
- Iffiltra l-kompiti (lesti, attivi, kollha). Użu
filterиreduce. - Jifhmu l-baŜi tal-Javascript.
Сортируемый drag and drop список
Huwa utli ħafna biex tifhem .
Ejja nitgħallmu:
- Iddreggja u qiegħed API
- Oħloq UIs sinjuri
Клон мессенджера (нативное приложение)
Int tifhem kif jaħdmu kemm l-applikazzjonijiet tal-web kif ukoll l-applikazzjonijiet indiġeni, li jiddistingwuk mill-massa griża.
Dak li se nistudjaw:
- Sokits tal-web (messaġġi istantanji)
- Kif jaħdmu l-applikazzjonijiet indiġeni.
- Kif jaħdmu l-mudelli fl-applikazzjonijiet indiġeni.
- L-organizzazzjoni ta' rotot għall-ipproċessar tat-talbiet f'applikazzjonijiet indiġeni.
Editur tat-test
L-iskop ta' editur tat-test huwa li jnaqqas l-isforz tal-utenti li jippruvaw jikkonvertu l-ifformattjar tagħhom f'markup HTML validu. Editur tat-test tajjeb jippermetti lill-utenti jifformattjaw it-test b'modi differenti.
F'xi punt, kulħadd uża editur tat-test. Allura għaliex le ?
Клон Reddit
huwa aggregazzjoni ta' aħbarijiet soċjali, klassifikazzjoni tal-kontenut tal-web u sit ta' diskussjoni.
Reddit jieħu l-biċċa l-kbira tal-ħin tiegħi, imma nkompli noqgħod fuqha. Il-ħolqien ta 'klonu ta' Reddit huwa mod effettiv biex titgħallem l-ipprogrammar (filwaqt li tkun qed tfittex Reddit fl-istess ħin).
Reddit jagħtik għani ħafna. Tħallix barra xi karatteristiċi jew tagħmel affarijiet bl-addoċċ. Fid-dinja reali mal-klijenti u l-klijenti, ma tistax taħdem bl-addoċċ, jew malajr titlef ix-xogħol tiegħek.
Klijenti intelliġenti immedjatament jirrealizzaw li x-xogħol qed isir ħażin u se jsibu lil xi ħadd ieħor.
Публикация пакета NPM с открытым исходным кодом
Jekk tikteb kodiċi Javascript, hemm ċans li tuża maniġer tal-pakketti. Maniġer tal-pakketti jippermettilek tuża mill-ġdid kodiċi eżistenti li nies oħra kitbu u ppubblikaw.
Il-fehim taċ-ċiklu sħiħ ta 'żvilupp ta' pakkett se jipprovdi esperjenza tajba ħafna. Hemm ħafna affarijiet li għandek bżonn tkun taf meta tippubblika l-kodiċi. Trid taħseb dwar is-sigurtà, il-verżjoni semantika, l-iskalabbiltà, il-konvenzjonijiet tal-ismijiet u l-manutenzjoni.
Il-pakkett jista 'jkun xi ħaġa. Jekk m'għandekx idea, oħloq il-Lodash tiegħek u ppubblikaha.
Lodash:
Li jkollok xi ħaġa li għamilt fuq l-internet tpoġġik 10% fuq oħrajn. dwar sorsi u pakketti miftuħa.
Учебный план freeCodeCamp
freeCodecamp ġabar ħafna .
freeCodeCamp hija organizzazzjoni mingħajr skop ta' qligħ. Tikkonsisti fi pjattaforma ta’ tagħlim interattiva bbażata fuq il-web, forum komunitarju onlajn, chat rooms, pubblikazzjonijiet Medium, u organizzazzjonijiet lokali li beħsiebhom jagħmlu l-iżvilupp tal-web tat-tagħlim aċċessibbli għal kulħadd.
Int tkun aktar minn kwalifikat għall-ewwel xogħol tiegħek jekk jirnexxilek tlesti l-kors kollu.
Создайте HTTP-сервер с нуля
Il-protokoll HTTP huwa wieħed mill-protokolli ewlenin li permezz tiegħu l-kontenut jivvjaġġa fuq l-Internet. Is-servers HTTP jintużaw biex iservu kontenut statiku bħal HTML, CSS, u JS.
Li tkun kapaċi timplimenta l-protokoll HTTP mill-bidu nett se tespandi l-għarfien tiegħek dwar kif l-affarijiet jinteraġixxu.
Pereżempju, jekk tuża NodeJs, allura taf li Express jipprovdi server HTTP.
Għal referenza, ara jekk tistax:
- Twaqqaf server mingħajr ma tuża l-ebda librerija
- Is-server għandu jservi kontenut HTML, CSS u JS.
- Implimentazzjoni ta 'router mill-bidu
- Tissorvelja l-bidliet u aġġorna s-server
Jekk ma tafx għaliex, uża u tipprova toħloq server HTTP mill-bidu.
Десктопное приложение для заметок
Aħna lkoll nieħdu noti, hux?
Ejja noħolqu app noti. L-applikazzjoni teħtieġ li tissejvja n-noti u tissinkronizzahom mad-database. Ibni app indiġena billi tuża Electron, Swift, jew dak kollu li tixtieq u dak li jaħdem għas-sistema tiegħek.
Ħossok liberu li tgħaqqad dan mal-ewwel sfida (editur tat-test).
Bħala bonus, ipprova ssinkronizza l-verżjoni tad-desktop tiegħek mal-verżjoni tal-web.
Подкасты (клон Overcast)
Min ma jisma' l-podcasts?
Oħloq applikazzjoni tal-web bil-funzjonalità li ġejja:
- Oħloq kont
- Fittex Podcasts
- Rata u abbona għal podcasts
- Waqqaf u tilgħab, ibdel il-veloċità, il-funzjonijiet 'il quddiem u lura għal 30 sekonda.
Ipprova uża l-iTunes API bħala punt tat-tluq. Jekk taf b'xi riżorsi oħra, jekk jogħġbok ibgħat fil-kummenti.
Qbid tal-iskrin
Bongu! Qed niffilmja l-iskrin tiegħi bħalissa!
Oħloq desktop jew app tal-web li tippermettilek taqbad l-iskrin tiegħek u tissejvja l-klipp bħala .gif
Hawnhekk kif tikseb dan.
Sorsi
Sors: www.habr.com