Skip to content

Tutorial React Project – Creați un site web de portofoliu cu animații avansate

Tutorial React Project – Creați un site web de portofoliu cu animații avansate

În acest videoclip, veți învăța cum să construiți site-ul web de portofoliu React de la zero cu animații avansate.

✏️ Slobodan a dezvoltat acest curs: https://www.youtube.com/channel/UCBu5ulO4d-d47lAVybpRTkw

🔗 Cod și active: https://github.com/bobangajicsm/react-portfolio-website
🔗 Biblioteca de hărți https://react-leaflet.js.org/
🔗 Biblioteca EmailJS: https://www.emailjs.com/docs/examples/reactjs/
🔗 Versiunea finală: https://bobangajicsm.github.io/portfolio

Învăța:
✔️ Cum să desenezi o animație SVG folosind GSAP și React
✔️ Cum să animați literele la hover folosind Animate.css și React
✔️ Cum să adăugați o animație de încărcare a paginii folosind React-Loaders
✔️ Cum să adăugați animație Pacman în React
✔️ Cum să creați animații CSS 3D personalizate
✔️ Cum să implementați pictogramele fonturilor în React
✔️ Cum să creați și să implementați formularul de contact în React folosind EmailJS
✔️ Cum să adăugați hărți pe site-ul dvs. în React folosind Leafleat.js

⭐️ Conținutul cursului ⭐️
⌨️ (0:00:00) Introducere
⌨️ (0:00:43) Creați aplicația React cu npx
⌨️ (0:01:01) Instalarea bibliotecilor
⌨️ (0:03:56) Definiți stiluri globale
⌨️ (0:06:56) Creați rute
⌨️ (0:09:01) Clădirea bară laterală din stânga
⌨️ (0:20:31) Aspectul șantierului
⌨️ (0:23:01) Pagina de pornire a clădirii
⌨️ (0:40:51) Desenați animație logo-ul SVG
⌨️ (0:48:29) Creați pagina Despre
⌨️ (1:03:56) Creați încărcător de pagină
⌨️ (1:06:11) Creați pagina de contact

🎉 Mulțumim susținătorilor noștri Campion și Sponsor:
👾 Raymond Odero
👾 Agustín Kussrow
👾 aldo ferretti
👾 Otis Morgan
👾 DeezMaster

Învățați să codificați gratuit și obțineți un job de dezvoltator: https://www.freecodecamp.org

Citiți sute de articole despre programare: https://freecodecamp.org/news

Cursuri interesante:

Leave a Reply

Your email address will not be published. Required fields are marked *