├── clase-2 ├── juan.html ├── contacto.html ├── nuevo.html ├── documentacion.txt ├── pepe.html └── index.html ├── clase-16 ├── documentacion.md ├── index.html ├── index.js └── correccion.js ├── clase-24 ├── .gitignore ├── src │ ├── main.jsx │ └── App.jsx ├── vite.config.js ├── index.html ├── README.md ├── package.json └── public │ └── vite.svg ├── clase-10 ├── .vscode │ └── settings.json ├── absolute │ ├── index.html │ ├── buscador-ml.html │ ├── style.css │ └── buscador-ml.css ├── relative │ ├── index.html │ └── style.css └── fixed │ ├── buscador-ml.html │ └── buscador-ml.css ├── clase-12 ├── .vscode │ └── settings.json ├── index.html └── script.js ├── clase-8 ├── .vscode │ └── settings.json ├── flex │ ├── index.html │ └── style.css ├── index.html ├── practica-hostinger │ ├── style.css │ └── index.html └── style.css ├── clase-23 ├── src │ ├── style.css │ ├── Components │ │ ├── Link.jsx │ │ ├── Boton.jsx │ │ ├── Formulario.jsx │ │ ├── Titulo.jsx │ │ └── SubscriptorCard.jsx │ ├── main.jsx │ └── App.jsx ├── vite.config.js ├── .gitignore ├── index.html ├── README.md ├── package.json └── public │ └── vite.svg ├── entergaron.txt ├── clase-25 ├── src │ ├── Components │ │ ├── FileList │ │ │ ├── FileList.css │ │ │ ├── hola.css │ │ │ └── FileList.jsx │ │ ├── index.js │ │ ├── ChatHistory │ │ │ └── ChatHistoryExample.jsx │ │ ├── ContactList │ │ │ ├── ContactList.jsx │ │ │ └── ContactList.css │ │ └── MenuDesplegableTareaCorregida.jsx │ ├── Icons │ │ └── index.js │ ├── style.css │ ├── Pages │ │ ├── ContactPage.jsx │ │ ├── ErrorPage.jsx │ │ └── HomePage.jsx │ ├── main.jsx │ ├── data-example.js │ ├── map-documentacion.js │ ├── utils │ │ └── constants.js │ ├── App.jsx │ ├── data-files.js │ └── data.js ├── public │ ├── images │ │ └── captura.png │ └── vite.svg ├── vite.config.js ├── .gitignore ├── index.html ├── README.md └── package.json ├── clase-3 ├── images │ └── autorojo.jpg ├── audios │ └── thinking-time-148496.mp3 ├── video │ └── istockphoto-1952193211-640_adpp_is.mp4 ├── pages │ └── contact.html └── tareas │ └── tarea.html ├── clase-19 ├── correcciones │ ├── math.js │ ├── index.html │ └── script.js └── index.html ├── proyecto-ecommerce ├── src │ ├── Pages │ │ ├── index.js │ │ ├── Detail │ │ │ └── Detail.jsx │ │ └── Home │ │ │ └── Home.jsx │ ├── Components │ │ ├── index.js │ │ ├── Footer │ │ │ └── Footer.jsx │ │ └── Header │ │ │ └── Header.jsx │ ├── main.jsx │ ├── App.jsx │ ├── hooks │ │ └── useProducts.jsx │ └── fetching │ │ └── productsFetching.js ├── vite.config.js ├── .gitignore ├── index.html ├── README.md ├── package.json └── public │ ├── vite.svg │ └── data │ └── products.json ├── clase-11 ├── hostinger-mediaqueries │ ├── images │ │ ├── ines.avif │ │ ├── alejandro.avif │ │ └── jonh-ortega.avif │ └── styles │ │ ├── style.css │ │ ├── normalize.css │ │ ├── global.css │ │ └── card-review.css ├── nav-blizzard │ ├── styles │ │ ├── normalize.css │ │ ├── style.css │ │ └── header.css │ ├── images │ │ └── battle-net.svg │ └── index.html ├── index.html ├── layout-2-asides │ └── style.css ├── style.css └── tartea-hostinger-clase-22-7 │ ├── style.css │ └── index.html ├── slack-clone ├── src │ ├── main.jsx │ ├── Components │ │ ├── ChatItem │ │ │ └── ChatItem.jsx │ │ ├── ChannelItem │ │ │ └── ChannelItem.jsx │ │ ├── Botones │ │ │ └── Botenes.jsx │ │ ├── ChannelList │ │ │ └── ChannelList.jsx │ │ └── ChatList │ │ │ └── ChatList.jsx │ └── App.jsx ├── vite.config.js ├── .gitignore ├── index.html ├── README.md └── package.json ├── clase-22-REACT ├── src │ ├── main.jsx │ └── App.jsx ├── vite.config.js ├── .gitignore ├── index.html ├── README.md ├── package.json └── public │ └── vite.svg ├── github-git pasos ├── git-registro.md ├── gitflow.md └── introduccion.md ├── React-proyecto-en-blanco ├── src │ ├── main.jsx │ └── App.jsx ├── vite.config.js ├── .gitignore ├── index.html ├── README.md ├── package.json └── public │ └── vite.svg ├── clase-15 ├── index.html ├── explicacion.js ├── correccion.js └── script.js ├── clase-14 └── index.html ├── clase-13 └── index.html ├── clase-18 ├── index.html ├── temas-vistos.md ├── metodos-de-string.js └── script.js ├── clase-20 ├── index.html ├── DOM │ ├── index.html │ └── script.js ├── script.js └── consigna.md ├── clase-21 ├── map │ ├── index.html │ └── script.js ├── index.html └── script.js ├── clase-7 ├── pages │ └── contact.html ├── index.html ├── tarea.html ├── styles │ └── style.css └── tarea.css ├── clase-17 ├── index.html ├── script.js ├── tareas.js └── objetos.js ├── pasos-react-con-vite.txt ├── clase-4 ├── html-de-prueba.html ├── html-semantico.html ├── tarea-navegador-mdn.html ├── formularios.html ├── tarea-html-semantico.html ├── navegador-complejo.html └── index.html ├── clase-5 └── index.html ├── clase-9 ├── correccion │ ├── style.css │ └── index.html ├── tarea-1-mdn │ ├── style.css │ └── index.html └── tarea-2-excalidraw │ └── style.css └── clase-6 ├── especificidad.html ├── index.html └── solucion-tarea.html /clase-2/juan.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /clase-2/contacto.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /clase-16/documentacion.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /clase-2/nuevo.html: -------------------------------------------------------------------------------- 1 |

Pepe

-------------------------------------------------------------------------------- /clase-24/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules -------------------------------------------------------------------------------- /clase-2/documentacion.txt: -------------------------------------------------------------------------------- 1 | blablalaspdjsadusahd -------------------------------------------------------------------------------- /clase-2/pepe.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | -------------------------------------------------------------------------------- /clase-10/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "liveServer.settings.port": 5501 3 | } -------------------------------------------------------------------------------- /clase-12/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "liveServer.settings.port": 5501 3 | } -------------------------------------------------------------------------------- /clase-8/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "liveServer.settings.port": 5502 3 | } -------------------------------------------------------------------------------- /clase-23/src/style.css: -------------------------------------------------------------------------------- 1 | body{ 2 | background-color: rgb(221, 189, 252); 3 | } -------------------------------------------------------------------------------- /entergaron.txt: -------------------------------------------------------------------------------- 1 | Angelina 2 | Juan pablo 3 | Ferrelli Federico 4 | ANTONELA de fazio -------------------------------------------------------------------------------- /clase-25/src/Components/FileList/FileList.css: -------------------------------------------------------------------------------- 1 | .file-list{ 2 | padding-left: 15px; 3 | } -------------------------------------------------------------------------------- /clase-25/src/Components/FileList/hola.css: -------------------------------------------------------------------------------- 1 | 2 | body{ 3 | background-color: red !important; 4 | } -------------------------------------------------------------------------------- /clase-3/images/autorojo.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Matu-Dev-JS/pwi-tm-lun-mie-julio/HEAD/clase-3/images/autorojo.jpg -------------------------------------------------------------------------------- /clase-19/correcciones/math.js: -------------------------------------------------------------------------------- 1 | export const sumar = (a, b) => { 2 | return a + b 3 | } 4 | 5 | export let nombre = 'pepe' -------------------------------------------------------------------------------- /clase-25/public/images/captura.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Matu-Dev-JS/pwi-tm-lun-mie-julio/HEAD/clase-25/public/images/captura.png -------------------------------------------------------------------------------- /proyecto-ecommerce/src/Pages/index.js: -------------------------------------------------------------------------------- 1 | import Home from "./Home/Home"; 2 | import Detail from "./Detail/Detail"; 3 | export { Home, Detail } -------------------------------------------------------------------------------- /clase-3/audios/thinking-time-148496.mp3: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Matu-Dev-JS/pwi-tm-lun-mie-julio/HEAD/clase-3/audios/thinking-time-148496.mp3 -------------------------------------------------------------------------------- /proyecto-ecommerce/src/Components/index.js: -------------------------------------------------------------------------------- 1 | import Footer from "./Footer/Footer"; 2 | import Header from "./Header/Header"; 3 | 4 | export{Header, Footer} -------------------------------------------------------------------------------- /clase-25/src/Icons/index.js: -------------------------------------------------------------------------------- 1 | import { GiArrowsShield as ShieldIcon, GiApc as TankIcon} from "react-icons/gi"; 2 | 3 | 4 | 5 | export {ShieldIcon, TankIcon} -------------------------------------------------------------------------------- /clase-11/hostinger-mediaqueries/images/ines.avif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Matu-Dev-JS/pwi-tm-lun-mie-julio/HEAD/clase-11/hostinger-mediaqueries/images/ines.avif -------------------------------------------------------------------------------- /clase-23/src/Components/Link.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | const Link = () => { 4 | return ( 5 |
Link
6 | ) 7 | } 8 | 9 | export default Link -------------------------------------------------------------------------------- /clase-3/video/istockphoto-1952193211-640_adpp_is.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Matu-Dev-JS/pwi-tm-lun-mie-julio/HEAD/clase-3/video/istockphoto-1952193211-640_adpp_is.mp4 -------------------------------------------------------------------------------- /clase-11/hostinger-mediaqueries/images/alejandro.avif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Matu-Dev-JS/pwi-tm-lun-mie-julio/HEAD/clase-11/hostinger-mediaqueries/images/alejandro.avif -------------------------------------------------------------------------------- /clase-11/hostinger-mediaqueries/images/jonh-ortega.avif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Matu-Dev-JS/pwi-tm-lun-mie-julio/HEAD/clase-11/hostinger-mediaqueries/images/jonh-ortega.avif -------------------------------------------------------------------------------- /clase-25/src/Components/index.js: -------------------------------------------------------------------------------- 1 | import ContactList from "./ContactList/ContactList"; 2 | import FileList from "./FileList/FileList"; 3 | 4 | 5 | export {ContactList, FileList} -------------------------------------------------------------------------------- /clase-23/src/main.jsx: -------------------------------------------------------------------------------- 1 | import { createRoot } from 'react-dom/client' 2 | import {App} from './App.jsx' 3 | 4 | 5 | createRoot(document.getElementById('root')).render( 6 | 7 | ) 8 | -------------------------------------------------------------------------------- /clase-24/src/main.jsx: -------------------------------------------------------------------------------- 1 | import { createRoot } from 'react-dom/client' 2 | import App from './App.jsx' 3 | 4 | 5 | createRoot(document.getElementById('root')).render( 6 | 7 | ) 8 | -------------------------------------------------------------------------------- /slack-clone/src/main.jsx: -------------------------------------------------------------------------------- 1 | import { createRoot } from 'react-dom/client' 2 | import App from './App.jsx' 3 | 4 | 5 | createRoot(document.getElementById('root')).render( 6 | 7 | ) 8 | -------------------------------------------------------------------------------- /clase-11/hostinger-mediaqueries/styles/style.css: -------------------------------------------------------------------------------- 1 | @import url('./normalize.css'); 2 | @import url('./global.css'); 3 | @import url('./card-review.css'); 4 | 5 | 6 | 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /clase-2/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 |

Primera version

7 |

Hola

8 |

9 | 10 | -------------------------------------------------------------------------------- /clase-22-REACT/src/main.jsx: -------------------------------------------------------------------------------- 1 | import { createRoot } from 'react-dom/client' 2 | import App from './App.jsx' 3 | 4 | 5 | createRoot(document.getElementById('root')).render( 6 | 7 | ) 8 | -------------------------------------------------------------------------------- /github-git pasos/git-registro.md: -------------------------------------------------------------------------------- 1 | Pasos para crear una identidad en git: 2 | 3 | git config --global user.name "John Doe" 4 | git config --global user.email johndoe@example.com 5 | git config --list -------------------------------------------------------------------------------- /proyecto-ecommerce/src/Components/Footer/Footer.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | const Footer = () => { 4 | return ( 5 |
Footer
6 | ) 7 | } 8 | 9 | export default Footer -------------------------------------------------------------------------------- /proyecto-ecommerce/src/Components/Header/Header.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | const Header = () => { 4 | return ( 5 |
Header
6 | ) 7 | } 8 | 9 | export default Header -------------------------------------------------------------------------------- /React-proyecto-en-blanco/src/main.jsx: -------------------------------------------------------------------------------- 1 | import { createRoot } from 'react-dom/client' 2 | import App from './App.jsx' 3 | 4 | 5 | createRoot(document.getElementById('root')).render( 6 | 7 | ) 8 | -------------------------------------------------------------------------------- /clase-23/vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite' 2 | import react from '@vitejs/plugin-react' 3 | 4 | // https://vitejs.dev/config/ 5 | export default defineConfig({ 6 | plugins: [react()], 7 | }) 8 | -------------------------------------------------------------------------------- /clase-24/vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite' 2 | import react from '@vitejs/plugin-react' 3 | 4 | // https://vitejs.dev/config/ 5 | export default defineConfig({ 6 | plugins: [react()], 7 | }) 8 | -------------------------------------------------------------------------------- /clase-25/src/style.css: -------------------------------------------------------------------------------- 1 | 2 | *{ 3 | font-family: sans-serif; 4 | } 5 | 6 | 7 | 8 | body{ 9 | background-color: black; 10 | color: white; 11 | } 12 | 13 | .icon-shield{ 14 | color: red; 15 | } -------------------------------------------------------------------------------- /clase-25/vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite' 2 | import react from '@vitejs/plugin-react' 3 | 4 | // https://vitejs.dev/config/ 5 | export default defineConfig({ 6 | plugins: [react()], 7 | }) 8 | -------------------------------------------------------------------------------- /slack-clone/vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite' 2 | import react from '@vitejs/plugin-react' 3 | 4 | // https://vitejs.dev/config/ 5 | export default defineConfig({ 6 | plugins: [react()], 7 | }) 8 | -------------------------------------------------------------------------------- /React-proyecto-en-blanco/src/App.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | function App() { 4 | 5 | 6 | return ( 7 |
8 | hola 9 |
10 | ) 11 | } 12 | 13 | export default App 14 | -------------------------------------------------------------------------------- /clase-22-REACT/vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite' 2 | import react from '@vitejs/plugin-react' 3 | 4 | // https://vitejs.dev/config/ 5 | export default defineConfig({ 6 | plugins: [react()], 7 | }) 8 | -------------------------------------------------------------------------------- /proyecto-ecommerce/vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite' 2 | import react from '@vitejs/plugin-react' 3 | 4 | // https://vitejs.dev/config/ 5 | export default defineConfig({ 6 | plugins: [react()], 7 | }) 8 | -------------------------------------------------------------------------------- /React-proyecto-en-blanco/vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite' 2 | import react from '@vitejs/plugin-react' 3 | 4 | // https://vitejs.dev/config/ 5 | export default defineConfig({ 6 | plugins: [react()], 7 | }) 8 | -------------------------------------------------------------------------------- /clase-25/src/Pages/ContactPage.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | const ContactPage = () => { 4 | return ( 5 |
6 |

Soy la pagina de contacto

7 |
8 | ) 9 | } 10 | 11 | export default ContactPage -------------------------------------------------------------------------------- /clase-25/src/Pages/ErrorPage.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | const ErrorPage = () => { 4 | return ( 5 |
6 |

No deberias estar aqui (error:404)

7 |
8 | ) 9 | } 10 | 11 | export default ErrorPage -------------------------------------------------------------------------------- /clase-11/nav-blizzard/styles/normalize.css: -------------------------------------------------------------------------------- 1 | *{ 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | list-style-type: none; 6 | font-family: "Poppins", sans-serif; 7 | } 8 | 9 | a{ 10 | text-decoration: none; 11 | 12 | } -------------------------------------------------------------------------------- /slack-clone/src/Components/ChatItem/ChatItem.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | const ChatItem = ({author, text}) => { 4 | return ( 5 |
6 |
{author}
7 |

{text}

8 |
9 | ) 10 | } 11 | export default ChatItem -------------------------------------------------------------------------------- /clase-25/src/main.jsx: -------------------------------------------------------------------------------- 1 | import { createRoot } from 'react-dom/client' 2 | import App from './App.jsx' 3 | import { BrowserRouter } from 'react-router-dom' 4 | 5 | 6 | createRoot(document.getElementById('root')).render( 7 | 8 | 9 | 10 | 11 | ) 12 | -------------------------------------------------------------------------------- /clase-23/src/Components/Boton.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | const Boton = () => { 4 | return ( 5 | 6 | ) 7 | } 8 | 9 | /* Si alguien importa a mi boton sin especificar a quien quiere importar, por defecto entregare el Boton */ 10 | export default Boton -------------------------------------------------------------------------------- /proyecto-ecommerce/src/main.jsx: -------------------------------------------------------------------------------- 1 | import { createRoot } from 'react-dom/client' 2 | import App from './App.jsx' 3 | import { BrowserRouter } from 'react-router-dom' 4 | 5 | createRoot(document.getElementById('root')).render( 6 | 7 | 8 | 9 | 10 | 11 | ) 12 | -------------------------------------------------------------------------------- /clase-15/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /clase-16/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /clase-14/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /clase-19/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /slack-clone/src/Components/ChannelItem/ChannelItem.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | const ChannelItem = ({id, nombre}) => { 4 | return ( 5 | 10 | ) 11 | } 12 | 13 | export default ChannelItem -------------------------------------------------------------------------------- /clase-13/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /clase-18/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /clase-20/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /clase-21/map/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /slack-clone/src/Components/Botones/Botenes.jsx: -------------------------------------------------------------------------------- 1 | const ButtonPrimary = ({text}) => { 2 | return ( 3 | 4 | ) 5 | } 6 | 7 | const ButtonSecondary = ({text}) => { 8 | return ( 9 | 10 | ) 11 | } -------------------------------------------------------------------------------- /clase-12/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /clase-7/pages/contact.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 |

Pagina contacto

11 | 12 | -------------------------------------------------------------------------------- /clase-23/.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | pnpm-debug.log* 8 | lerna-debug.log* 9 | 10 | node_modules 11 | dist 12 | dist-ssr 13 | *.local 14 | 15 | # Editor directories and files 16 | .vscode/* 17 | !.vscode/extensions.json 18 | .idea 19 | .DS_Store 20 | *.suo 21 | *.ntvs* 22 | *.njsproj 23 | *.sln 24 | *.sw? 25 | -------------------------------------------------------------------------------- /clase-25/.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | pnpm-debug.log* 8 | lerna-debug.log* 9 | 10 | node_modules 11 | dist 12 | dist-ssr 13 | *.local 14 | 15 | # Editor directories and files 16 | .vscode/* 17 | !.vscode/extensions.json 18 | .idea 19 | .DS_Store 20 | *.suo 21 | *.ntvs* 22 | *.njsproj 23 | *.sln 24 | *.sw? 25 | -------------------------------------------------------------------------------- /slack-clone/.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | pnpm-debug.log* 8 | lerna-debug.log* 9 | 10 | node_modules 11 | dist 12 | dist-ssr 13 | *.local 14 | 15 | # Editor directories and files 16 | .vscode/* 17 | !.vscode/extensions.json 18 | .idea 19 | .DS_Store 20 | *.suo 21 | *.ntvs* 22 | *.njsproj 23 | *.sln 24 | *.sw? 25 | -------------------------------------------------------------------------------- /clase-22-REACT/.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | pnpm-debug.log* 8 | lerna-debug.log* 9 | 10 | node_modules 11 | dist 12 | dist-ssr 13 | *.local 14 | 15 | # Editor directories and files 16 | .vscode/* 17 | !.vscode/extensions.json 18 | .idea 19 | .DS_Store 20 | *.suo 21 | *.ntvs* 22 | *.njsproj 23 | *.sln 24 | *.sw? 25 | -------------------------------------------------------------------------------- /proyecto-ecommerce/.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | pnpm-debug.log* 8 | lerna-debug.log* 9 | 10 | node_modules 11 | dist 12 | dist-ssr 13 | *.local 14 | 15 | # Editor directories and files 16 | .vscode/* 17 | !.vscode/extensions.json 18 | .idea 19 | .DS_Store 20 | *.suo 21 | *.ntvs* 22 | *.njsproj 23 | *.sln 24 | *.sw? 25 | -------------------------------------------------------------------------------- /clase-23/src/Components/Formulario.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | 4 | export const Formulario = () =>{ 5 | 6 | return ( 7 |
8 |
9 | 10 | 11 |
12 |
13 | ) 14 | } 15 | 16 | -------------------------------------------------------------------------------- /React-proyecto-en-blanco/.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | pnpm-debug.log* 8 | lerna-debug.log* 9 | 10 | node_modules 11 | dist 12 | dist-ssr 13 | *.local 14 | 15 | # Editor directories and files 16 | .vscode/* 17 | !.vscode/extensions.json 18 | .idea 19 | .DS_Store 20 | *.suo 21 | *.ntvs* 22 | *.njsproj 23 | *.sln 24 | *.sw? 25 | -------------------------------------------------------------------------------- /clase-11/nav-blizzard/styles/style.css: -------------------------------------------------------------------------------- 1 | @import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"); 2 | @import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap'); 3 | @import url("./normalize.css"); 4 | @import url("./header.css"); 5 | 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /clase-3/pages/contact.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | Ir a inicio 10 | Nueva seccion 11 |

Esta es la pagina de contacto

12 | 13 | -------------------------------------------------------------------------------- /clase-23/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Vite + React 8 | 9 | 10 |
11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /clase-24/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Vite + React 8 | 9 | 10 |
11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /clase-25/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Vite + React 8 | 9 | 10 |
11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /clase-22-REACT/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Vite + React 8 | 9 | 10 |
11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /slack-clone/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Vite + React 8 | 9 | 10 |
11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /proyecto-ecommerce/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Vite + React 8 | 9 | 10 |
11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /React-proyecto-en-blanco/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Vite + React 8 | 9 | 10 |
11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /clase-17/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 13 | 14 | 15 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /pasos-react-con-vite.txt: -------------------------------------------------------------------------------- 1 | Abrir terminal 2 | 3 | ejecutamos: 4 | npm create vite@latest 5 | (si nos aparece que debemos instalar algo le damos Y) 6 | seleccionamos un nombre 7 | seleccionamos un nombre de paquete 8 | seleccionamos como framework REACT 9 | seleccionamos como variante javascript o javascript-swc 10 | 11 | Abrimos con VSC la carpeta que se creo del proyecto 12 | 13 | Abrimos terminal 14 | ejecutamos: 15 | npm install 16 | npm run dev 17 | -------------------------------------------------------------------------------- /clase-10/absolute/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 |
11 |
12 |
13 |
14 |
15 | 16 | -------------------------------------------------------------------------------- /clase-10/relative/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 |
11 |
12 |
13 |
14 |
15 | 16 | -------------------------------------------------------------------------------- /clase-23/README.md: -------------------------------------------------------------------------------- 1 | # React + Vite 2 | 3 | This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. 4 | 5 | Currently, two official plugins are available: 6 | 7 | - [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh 8 | - [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh 9 | -------------------------------------------------------------------------------- /clase-24/README.md: -------------------------------------------------------------------------------- 1 | # React + Vite 2 | 3 | This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. 4 | 5 | Currently, two official plugins are available: 6 | 7 | - [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh 8 | - [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh 9 | -------------------------------------------------------------------------------- /clase-25/README.md: -------------------------------------------------------------------------------- 1 | # React + Vite 2 | 3 | This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. 4 | 5 | Currently, two official plugins are available: 6 | 7 | - [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh 8 | - [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh 9 | -------------------------------------------------------------------------------- /clase-22-REACT/README.md: -------------------------------------------------------------------------------- 1 | # React + Vite 2 | 3 | This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. 4 | 5 | Currently, two official plugins are available: 6 | 7 | - [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh 8 | - [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh 9 | -------------------------------------------------------------------------------- /slack-clone/README.md: -------------------------------------------------------------------------------- 1 | # React + Vite 2 | 3 | This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. 4 | 5 | Currently, two official plugins are available: 6 | 7 | - [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh 8 | - [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh 9 | -------------------------------------------------------------------------------- /proyecto-ecommerce/README.md: -------------------------------------------------------------------------------- 1 | # React + Vite 2 | 3 | This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. 4 | 5 | Currently, two official plugins are available: 6 | 7 | - [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh 8 | - [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh 9 | -------------------------------------------------------------------------------- /React-proyecto-en-blanco/README.md: -------------------------------------------------------------------------------- 1 | # React + Vite 2 | 3 | This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. 4 | 5 | Currently, two official plugins are available: 6 | 7 | - [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh 8 | - [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh 9 | -------------------------------------------------------------------------------- /proyecto-ecommerce/src/App.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { Route, Routes } from 'react-router-dom' 3 | import { Detail, Home } from './Pages' 4 | 5 | 6 | 7 | 8 | function App() { 9 | 10 | 11 | return ( 12 | <> 13 | 14 | 15 | }/> 16 | }/> 17 | }/> 18 | 19 | 20 | 21 | ) 22 | } 23 | 24 | export default App 25 | -------------------------------------------------------------------------------- /clase-18/temas-vistos.md: -------------------------------------------------------------------------------- 1 | ## Temas vistos 2 | 3 | - tipos de datos (relevantes) 4 | - operadores aritmeticos (relevantes) 5 | - operadores logicos (relevantes) 6 | - IF, ELSE, ELSE IF (relevantes) 7 | - FOR, WHILE 8 | - Funciones (relvante) 9 | - FOR...OF, FOR...IN 10 | - ARRAYS y OBJETOS (relevantes) 11 | - Metodos de arrays (relevante) 12 | - includes 13 | - push 14 | - splice 15 | - Template strings 16 | 17 | 18 | ## Temas de semana 19 | - metodos de string 20 | - callback 21 | - arrow functions 22 | - metodos avanzados de array -------------------------------------------------------------------------------- /clase-4/html-de-prueba.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 |
10 |
11 | 12 |
13 |
14 |
15 |
16 |

Lorem ipsum dolor sit amet

17 | 18 | 19 |
20 |
21 | 22 | -------------------------------------------------------------------------------- /clase-23/src/Components/Titulo.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | 4 | const Titulo = (props) => { 5 | console.log(props.text) 6 | return ( 7 |

8 | {props.text} 9 |

10 | ) 11 | } 12 | 13 | const SubTitulo = () => { 14 | return ( 15 |

Soy un subtitulo

16 | ) 17 | } 18 | 19 | const SubSubTitulo = () => { 20 | return ( 21 |

Soy un sub sub titulo

22 | ) 23 | } 24 | 25 | export {Titulo, SubTitulo, SubSubTitulo} 26 | export default Titulo -------------------------------------------------------------------------------- /clase-19/correcciones/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /clase-8/flex/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 |
11 |
12 |
13 |
14 | 15 | 16 |
17 | 18 |
19 | 20 | -------------------------------------------------------------------------------- /slack-clone/src/Components/ChannelList/ChannelList.jsx: -------------------------------------------------------------------------------- 1 | //Buena practica 2 | import React from 'react' 3 | import ChannelItem from '../ChannelItem/ChannelItem' 4 | 5 | const ChannelList = ({titulo, canales}) => { 6 | 7 | 8 | return ( 9 | <> 10 |

{titulo}

11 | { 12 | canales.map((canal) => { 13 | return ( 14 | 15 | )}) 16 | } 17 | 18 | ) 19 | } 20 | 21 | export default ChannelList 22 | -------------------------------------------------------------------------------- /clase-11/hostinger-mediaqueries/styles/normalize.css: -------------------------------------------------------------------------------- 1 | @import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"); 2 | @import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap'); 3 | *{ 4 | margin: 0; 5 | padding: 0; 6 | box-sizing: border-box; 7 | font-family: "DM Sans", sans-serif; 8 | } 9 | 10 | :root{ 11 | --text-1: #2f166a; 12 | --text-2: #673de6; 13 | --text-3: #d5dfff; 14 | --background-1: #FFFFFF; 15 | --background-2: #F4F5FF; 16 | --border-1: 1px solid var(--text-3); 17 | } -------------------------------------------------------------------------------- /clase-4/html-semantico.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 |
10 |

Logo

11 | 14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 | 26 | -------------------------------------------------------------------------------- /clase-10/absolute/buscador-ml.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Document 7 | 8 | 9 | 10 |
11 |
12 | 13 | 17 | 18 |
19 | 20 |
21 | 22 | -------------------------------------------------------------------------------- /clase-25/src/data-example.js: -------------------------------------------------------------------------------- 1 | const listaContactos = [ 2 | { 3 | nombre: 'Pepe Suarez', 4 | status: 'CONNECTED', 5 | iniciales: 'PS', 6 | id: 1 7 | }, 8 | { 9 | nombre: 'Maria Gutierrez', 10 | status: 'DISCONNECTED', 11 | iniciales: 'MG', 12 | id: 2 13 | }, 14 | { 15 | nombre: 'Juan Perez', 16 | status: 'DISCONNECTED', 17 | iniciales: 'JP', 18 | id: 3 19 | }, 20 | { 21 | nombre: 'Pedro Gonzalez', 22 | status: 'CONNECTED', 23 | iniciales: 'PG', 24 | id: 4 25 | }, 26 | ] 27 | export default listaContactos -------------------------------------------------------------------------------- /proyecto-ecommerce/src/Pages/Detail/Detail.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { Footer, Header } from '../../Components' 3 | import { useParams } from 'react-router-dom' 4 | import { obtenerProductoPorId } from '../../fetching/productsFetching' 5 | 6 | const Detail = () => { 7 | //USE PARAMS NOS TRAERA LOS PARAMETROS DE BUSQUEDA USADOS EN UNA RUTA 8 | const {product_id} = useParams() 9 | obtenerProductoPorId(70) 10 | console.log(product_id) 11 | return ( 12 | <> 13 |
14 |
15 | Contenido de detail 16 |
17 |