1. Kreditu txartelaren formularioa
Kreditu-txartel forma polita, mikro-interakzio leun eta atseginekin. Zenbakien formatua, egiaztapena eta txartel mota automatikoki hautematea barne hartzen ditu. Vue.js-en eraikita dago eta guztiz erantzuten du. (Ikus dezakezu .)
Zer ikasiko duzu:
- Inprimakiak prozesatu eta balioztatu
- Gertaerak kudeatu (adibidez, eremuak aldatzen direnean)
- Ulertzea orrialdean elementuak nola bistaratu eta jarri, batez ere inprimakiaren gainean agertzen den kreditu-txartelaren informazioa
Artikulua EDISON Software-ren laguntzarekin itzuli da Eta .
2. Histograma
Histograma bat datu kategorikoak adierazten dituen taula edo grafikoa da, adierazten dituzten balioekiko altuera edo luzera proportzionalak dituzten barra laukizuzenekin.
Bertikalean edo horizontalean aplika daitezke. Barra-diagrama bertikal bati lerro-diagrama deitzen zaio batzuetan.
Zer ikasiko duzu:
- Erakutsi datuak modu egituratu eta ulergarrian
- Gainera: ikasi elementua nola erabiltzen den
canvaseta harekin elementuak nola marraztu
munduko biztanleriaren datuak aurki ditzakezu. Urteka sailkatuta daude.
3. Twitter Bihotz Animazioa
2016an, Twitterrek animazio harrigarri hau aurkeztu zuen bere txioetarako. 2019tik aurrera, oraindik ere itxura du, beraz, zergatik ez sortu zuk zeuk?
Zer ikasiko duzu:
- CSS atributuarekin lan egin
keyframes - Manipulatu eta animatu HTML elementuak
- Konbinatu JavaScript, HTML eta CSS
4. GitHub biltegiak bilaketa funtzioarekin
Hemen ez dago ezer dotorerik: GitHub biltegiak zerrenda goretsi bat besterik ez dira.
Helburua biltegiak bistaratzea eta erabiltzaileak iragazteko aukera ematea da. Erabili erabiltzaile bakoitzaren biltegiak lortzeko.
GitHub profil orria -
Zer ikasiko duzu:
- Jaso datuak APItik
- Bistaratu APIko datuak
- Iragazi eta erakutsi bilaketa bakoitzerako datu garrantzitsuak
- Aukerakoa: erronka bat egiteko prest bazaude, erabili , GraphQL erabiliz eraikia. .
5. Reddit estiloko txatak
Txatak komunikatzeko modu ezagunak dira, erraztasunagatik eta erabiltzeko erraztasunagatik. Baina zerk elikatzen ditu txat-gela modernoak? WebSockets!
Zer ikasiko duzu:
- Erabili WebSockets, denbora errealeko komunikazioa eta datuen eguneraketak
- Erabiltzaileen sarbide-mailekin lan egin (adibidez, txat-kanal baten jabeak du rola
admin, eta beste batzuk gelan -user) - Inprimakiak prozesatu eta balioztatu - gogoratu, mezu bat bidaltzeko txat-leihoa dela
input - Sortu eta elkartu txat ezberdinetan
- Mezu pertsonalekin lan egin. Erabiltzaileek beste erabiltzaile batzuekin modu pribatuan txateatu dezakete. Funtsean, WebSocket konexio bat ezarriko duzu bi erabiltzaileren artean.
6. Marra estiloko nabigazioa
Nabigazio hau berezia egiten duena da popover edukiontzia eraldatzen dela edukiari egokitzeko. Trantsizio honek dotorezia dauka popover berri bat ireki eta ixteko ohiko jokabidearekin alderatuta.
Zer ikasiko duzu:
- Konbinatu CSS animazioak trantsizioekin
- Lausotu edukia eta aplikatu klase aktiboa flotatutako elementuari
Saiatu zeure burua egiten lehenik, baina laguntza behar baduzu, begiratu hau .
Iturria: www.habr.com