Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commite39ed62

Browse files
committed
Publicación curso de Python Web
1 parentea1593d commite39ed62

File tree

5 files changed

+90
-30
lines changed

5 files changed

+90
-30
lines changed

‎Images/header.jpg‎

-27.7 KB
Loading

‎Images/web.gif‎

3.2 MB
Loading

‎Images/web.png‎

175 KB
Loading

‎README.md‎

Lines changed: 42 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -3,53 +3,69 @@
33
[![Python](https://img.shields.io/badge/Python-3.11+-yellow?style=for-the-badge&logo=python&logoColor=white&labelColor=101010)](https://python.org)
44
[![Reflex](https://img.shields.io/badge/Reflex-0.3.6+-5646ED?style=for-the-badge&logo=reflex&logoColor=white&labelColor=101010)](https://reflex.dev)
55

6-
##Curso para aprender desarrollo web frontend con Python puro y Reflex desde cero
6+
##Cursode 6 horas en vídeopara aprender desarrollo web frontend con Python puro y Reflex desde cero.
77

88
![](./Images/header.jpg)
99

1010
###Proyecto realizado durante emisiones en directo desde[Twitch](https://twitch.tv/mouredev)
1111
>#####Si consideras útil el curso, apóyalo haciendo "★ Star" en el repositorio. ¡Gracias!
1212
13-
##Primera parte finalizada... ¿Ya está?
14-
Muy pronto tendrás un curso editado publicado en[YouTube](https://youtube.com/@mouredev) con todo el contenido de esta primera parte... ¡Pero esto no acaba aquí!
13+
##Tutorial en vídeo
14+
15+
<ahref="https://youtu.be/n2YrGsXJC6Y"><imgsrc="http://i3.ytimg.com/vi/n2YrGsXJC6Y/maxresdefault.jpg"style="height:50%;width:50%;"/></a>
16+
17+
-[Curso de Python Web](https://youtu.be/n2YrGsXJC6Y)
18+
-[Lección 1 - Introducción](https://youtu.be/n2YrGsXJC6Y&t=272)
19+
-[Lección 2 - Características](https://youtu.be/n2YrGsXJC6Y&t=1147)
20+
-[Lección 3 - Instalación](https://youtu.be/n2YrGsXJC6Y&t=1551)
21+
-[Lección 4 - Primeros pasos](https://youtu.be/n2YrGsXJC6Y&t=3043)
22+
-[Lección 5 - Fundamentos](https://youtu.be/n2YrGsXJC6Y&t=3442)
23+
-[Lección 6 - Hola mundo](https://youtu.be/n2YrGsXJC6Y&t=4259)
24+
-[Lección 7 - Componentes](https://youtu.be/n2YrGsXJC6Y&t=4593)
25+
-[Lección 8 - Maquetación](https://youtu.be/n2YrGsXJC6Y&t=6805)
26+
-[Lección 9 - Estilos](https://youtu.be/n2YrGsXJC6Y&t=9190)
27+
-[Lección 10 - Colores e iconos](https://youtu.be/n2YrGsXJC6Y&t=13807)
28+
-[Lección 11 - Fuentes](https://youtu.be/n2YrGsXJC6Y&t=15124)
29+
-[Lección 12 - Imágenes](https://youtu.be/n2YrGsXJC6Y&t=16249)
30+
-[Lección 13 - Fuentes remotas](https://youtu.be/n2YrGsXJC6Y&t=17505)
31+
-[Lección 14 - Diseño responsive](https://youtu.be/n2YrGsXJC6Y&t=18225)
32+
-[Lección 15 - Accesibilidad](https://youtu.be/n2YrGsXJC6Y&t=19058)
33+
-[Lección 16 - Despliegue](https://youtu.be/n2YrGsXJC6Y&t=19283)
34+
-[Próximos pasos](https://youtu.be/n2YrGsXJC6Y&t=20892)
35+
36+
>Tienes un canal llamado**"python"** en el servidor de**[Discord](https://mouredev.com/discord)** de la comunidad para preguntar, compartir y ayudar.
1537
16-
Este curso continuará en una segunda parte donde aprenderemos sobre backend, routers, apis, bases de datos y mucho más...
17-
18-
*Estén atento al repositorio y mis redes sociales para no perderte la continuación.*
19-
20-
##Clases anteriores
38+
##Proyecto
2139

22-
###Clase 1 (04/10/2023): Introducción, instalación y configuración
23-
####▶️[Ver clase en vídeo](https://www.twitch.tv/videos/1942562640?t=00h18m05s)
40+
<ahref="https://moure.dev"><imgsrc="./Images/web.png"style="height:50%;width:50%;"/></a>
41+
<ahref="./link_bio"><imgsrc="./Images/web.gif"style="height:50%;width:50%;"/></a>
2442

25-
###Clase 2 (11/10/2023): Componentes visuales
26-
####▶️[Ver clase en vídeo](https://www.twitch.tv/videos/1948407270?t=00h20m02s)
43+
Durante el curso aprenderemos desarrollo web con Python puro utilizando el framework[Reflex](https://github.com/reflex-dev/reflex). Realizaremos un proyecto práctico que consistirá en desarrollar y publicar mi nueva web de links[moure.dev](https://moure.dev/) (añadiéndole nuevas funcionalidades).
44+
Todo el código está disponible para que cualquiera pueda usarlo.
2745

28-
###Clase 3 (18/10/2023): Estilos
29-
####▶️[Ver clase en vídeo](https://www.twitch.tv/videos/1954230750?t=00h18m23s)
46+
###💻[Accede al código del proyecto](./link_bio)
3047

31-
###Clase 4 (25/10/2023): Colores, fuentes e imágenes
32-
####▶️[Ver clase en vídeo](https://www.twitch.tv/videos/1960113237?t=00h24m03s)
48+
##Tutorial extra en vídeo (+3 horas)
3349

34-
###Clase 5 (30/11/2023): Responsive, accesibilidad y despliegue
35-
####▶️[Ver clase en vídeo](https://www.twitch.tv/videos/1991405421?t=00h17m05s)
50+
<ahref="https://youtu.be/h8Tn0ITRoQs"><imgsrc="http://i3.ytimg.com/vi/h8Tn0ITRoQs/maxresdefault.jpg"style="height:50%;width:50%;"/></a>
3651

37-
##Proyecto
52+
Proyecto práctico extra de código libre que consistirá en desarrollar y publicar la web del[Calendario de aDEViento](https://adviento.dev/) de la comunidad. Una activdad donde repartimos cursos y libros sobre programación en Navidad.
3853

39-
Durante el curso aprenderemos desarrollo web con Python puro utilizando el framework[Reflex](https://github.com/reflex-dev/reflex). Realizaremos un proyecto práctico que consistirá en desarrollar y publicar mi nueva web de links[moure.dev](https://moure.dev/) (añadiéndole muchas nuevas funcionalidades).
40-
Todo el código estará disponible para que cualquiera pueda usarlo.
41-
42-
###💻[Accede al código del proyecto](./link_bio)
54+
###💻[Accede al código del proyecto extra](https://github.com/mouredev/adeviento-web)
4355

4456
##Información importante y preguntas frecuentes
4557

46-
Este curso se encuentra en desarrollo. Todo el contenido se crea en directo desde[Twitch](https://www.twitch.tv/mouredev), y en este repositorio podrás encontrar las clases en vídeo, el código programado, enlaces de interés y la información de la próxima clase.
47-
48-
Una vez se finalice, se creará un vídeo que agrupe todas las clases y se publicará en[YouTube](https://www.youtube.com/@mouredev).
58+
Todo el contenido se crea en directo desde[Twitch](https://www.twitch.tv/mouredev), y en este repositorio podrás encontrar las clases en vídeo, el código programado, enlaces de interés y la información relevante.
4959

5060
* Es un curso desde cero y no necesitas conocimientos previos sobre desarrollo web.
5161
* Recuerda que he creado en el[Discord](https://discord.gg/mouredev) un canal "🐍python" para que puedas comentar lo que quieras.
5262

63+
##Curso finalizado... ¿Ya está?
64+
65+
Este curso continuará en una segunda parte donde aprenderemos sobre backend, routers, APIs, bases de datos y mucho más...
66+
67+
*Estén atento al repositorio y mis[redes sociales](https://moure.dev) para no perderte la continuación.*
68+
5369
##Enlaces de interés
5470

5571
*[Web oficial de Python](https://www.python.org/)

‎link_bio/README.md‎

Lines changed: 48 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,17 +5,26 @@
55

66
##Proyecto desarrollado con[Python](https://www.python.org/) y[Reflex](https://reflex.dev/) que representa un sitio web personal estilo "[link in bio](https://moure.dev/)"
77

8+
![https://moure.dev](../Images/web.png)
9+
![https://moure.dev](../Images/web.gif)
10+
11+
##Tutorial
12+
13+
Consulta el[curso](../README.md) de 6 horas en vídeo desde cero que muestra el proceso de desarrollo de la web.
14+
815
##Requisitos
916

10-
####Crea un entorno virtual[venv](https://packaging.python.org/en/latest/guides/installing-using-pip-and-virtual-environments/) en la raíz del proyecto
17+
####Instala y crea un entorno virtual[venv](https://packaging.python.org/en/latest/guides/installing-using-pip-and-virtual-environments/) en la raíz del proyecto
1118
Mac/Linux:`python3 -m pip install virtualenv`
1219

1320
Windows:`py -m pip install --user virtualenv`
1421

22+
`python3 -m venv venv`
23+
1524
####Activa el entorno virtual
16-
Mac/Linux:`sourceenv/bin/activate`
25+
Mac/Linux:`sourcevenv/bin/activate`
1726

18-
Windows:`.\env\Scripts\activate`
27+
Windows:`.\venv\Scripts\activate`
1928

2029
Para desactivar el entorno virtual:`deactivate`
2130

@@ -24,9 +33,44 @@ Para desactivar el entorno virtual: `deactivate`
2433

2534
`pip install reflex`
2635

36+
También las tienes en`requirements.txt`
37+
38+
`python -m pip install -r requirements.txt`
39+
2740
##Ejecución
2841
`reflex run`
2942

3043
`reflex run --loglevel debug`*(modo debug)*
3144

32-
Acceder a[http://localhost:3000](http://localhost:3000) (frontend) y a[http://localhost:8000](http://localhost:8000) (backend)
45+
Acceder a[http://localhost:3000](http://localhost:3000) (frontend) y a[http://localhost:8000](http://localhost:8000) (backend)
46+
47+
##Despliegue
48+
49+
El script build.sh contiene las instrucciones necesarias para empaquetar el frontend del proyecto y desplegarlo de forma estática. Éste, en concreto, desde[Vercel](https://vercel.com/).
50+
51+
`sh build.sh`
52+
53+
```bash
54+
source .venv/bin/activate
55+
pip install --upgrade pip
56+
pip install -r requirements.txt
57+
reflex init
58+
reflexexport --frontend-only
59+
rm -fr public
60+
unzip frontend.zip -d public
61+
rm -f frontend.zip
62+
deactivate
63+
```
64+
65+
*Básicamente, prepera el entorno, instala dependencias, inicializa el proyecto, crea la construcción de producción, y la descomprime.*
66+
67+
>El proyecto se puede desplegar en cualquier proveedor o servidor que soporte recursos estáticos.
68+
>
69+
>[moure.dev](https://moure.dev) se encuentra desplegado en[Vercel](https://vercel.com).
70+
71+
Configuración en Vercel:
72+
73+
* Se ha asociado el repositorio de GitHub al proyecto (para que cada`push` en la rama`main` desencadene un nuevo despliegue)
74+
* Build & Development Settings: Other
75+
* Root Directory:`public` (que contiene el empaquetado estático para producción)
76+
* Custom Domain: adviento.dev

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp