├── _config.yml
├── static
    └── mystyle.css
├── templates
    ├── about.html
    ├── index.html
    └── base.html
├── app.py
└── README.md


/_config.yml:
--------------------------------------------------------------------------------
1 | theme: jekyll-theme-minimal


--------------------------------------------------------------------------------
/static/mystyle.css:
--------------------------------------------------------------------------------
1 | body {
2 | 	font-family: 'Lato';
3 | }


--------------------------------------------------------------------------------
/templates/about.html:
--------------------------------------------------------------------------------
1 | {% extends "base.html" %}
2 | {% block content %}
3 | 
4 | {% endblock %}


--------------------------------------------------------------------------------
/app.py:
--------------------------------------------------------------------------------
 1 | from flask import Flask
 2 | from flask import render_template
 3 | 
 4 | 
 5 | app = Flask(__name__)
 6 | 
 7 | eventos = [
 8 | 	{
 9 | 		"title": "Evento random #1",
10 | 		"desc": "Descripción random sobre mi evento favorito #1."
11 | 	},
12 | 	{
13 | 		"title": "Evento random #2",
14 | 		"desc": "Descripción random sobre mi evento favorito #2."
15 | 	},
16 | 	{
17 | 		"title": "Evento random #3",
18 | 		"desc": "Descripción random sobre mi evento favorito #3."
19 | 	}
20 | ]
21 | 
22 | 
23 | @app.route('/')
24 | def index():
25 | 	return render_template('index.html', e=eventos)
26 | 
27 | 
28 | @app.route('/acerca-de')
29 | def about():
30 | 	return render_template('about.html')
31 | 
32 | 
33 | if __name__ == "__main__":
34 | 	app.run(debug=True, port=5000)


--------------------------------------------------------------------------------
/templates/index.html:
--------------------------------------------------------------------------------
 1 | {% extends "base.html" %}
 2 | {% block content %}
 3 | <!-- Page Content -->
 4 | <div class="container">
 5 | 
 6 | 	<div class="row">
 7 | 		<div class="col-md-8 mb-5">
 8 | 		<h2>What We Do</h2>
 9 | 		<hr>
10 | 		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. A deserunt neque tempore recusandae animi soluta quasi? Asperiores rem dolore eaque vel, porro, soluta unde debitis aliquam laboriosam. Repellat explicabo, maiores!</p>
11 | 		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Omnis optio neque consectetur consequatur magni in nisi, natus beatae quidem quam odit commodi ducimus totam eum, alias, adipisci nesciunt voluptate. Voluptatum.</p>
12 | 		<a class="btn btn-primary btn-lg" href="#">Call to Action &raquo;</a>
13 | 		</div>
14 | 		<div class="col-md-4 mb-5">
15 | 		<h2>Contact Us</h2>
16 | 		<hr>
17 | 		<address>
18 | 			<strong>Start Bootstrap</strong>
19 | 			<br>3481 Melrose Place
20 | 			<br>Beverly Hills, CA 90210
21 | 			<br>
22 | 		</address>
23 | 		<address>
24 | 			<abbr title="Phone">P:</abbr>
25 | 			(123) 456-7890
26 | 			<br>
27 | 			<abbr title="Email">E:</abbr>
28 | 			<a href="mailto:#">name@example.com</a>
29 | 		</address>
30 | 		</div>
31 | 	</div>
32 | 	<!-- /.row -->
33 | 
34 | 	<div class="row">
35 | 		{% for evento in e %}
36 | 		<div class="col-md-4 mb-5">
37 | 			<div class="card h-100">
38 | 				<img class="card-img-top" src="http://placehold.it/300x200" alt="">
39 | 				<div class="card-body">
40 | 				<h4 class="card-title">{{ evento["title"] }}</h4>
41 | 				<p class="card-text">{{ evento["desc"] }}</p>
42 | 				</div>
43 | 				<div class="card-footer">
44 | 				<a href="#" class="btn btn-primary">Find Out More!</a>
45 | 				</div>
46 | 			</div>
47 | 		</div>
48 | 		{% endfor %}
49 | 	</div>
50 | 	<!-- /.row -->
51 | 
52 | </div>
53 | <!-- /.container -->
54 | {% endblock %}


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # Curso Python ENES-UNAM León
 2 | 
 3 | Bienvenid@ al curso de introducción al desarrollo web con Python en la ENES León, 2020.
 4 | 
 5 | ## Material
 6 | 
 7 | El curso consta de 4 módulos (y un módulo extra) que puedes encontrar a continuación:
 8 | 
 9 | - [Módulo 1 – Intro, setup y web](https://docs.google.com/presentation/d/e/2PACX-1vQp9pUDltmomU8lbcCgt7DsacZbQTMhGI5yZ1P1gngqocMhEUk0QoMXfsmypgLP6pftH41HWLBsHMsv/pub?start=false&loop=false&delayms=3000)
10 | - [Módulo 2 – Python básico y web](https://docs.google.com/presentation/d/e/2PACX-1vSeti2usStNiSFUqaxidJ5bwq2Yypz6BVxLbtkDRRV3IX595p174CVoReErjM0TJCPSnPF8UTQG4cjm/pub?start=false&loop=false&delayms=3000)
11 | - [Módulo 3 – Introducción a Flask](https://docs.google.com/presentation/d/e/2PACX-1vT9l9vWr_1622Tt6X3707G_CrtblbcS1PsH8Po61WljfnRAtr3efhOyHm5SbbPf5RtsfQjy8M9EXxDx/pub?start=false&loop=false&delayms=3000)
12 | - [Módulo 4 – Diseño de una web app](https://docs.google.com/presentation/d/e/2PACX-1vToYcrnkIDXbVsztdMhsujXXZRnUNHahsg0jWTy4SxLMIPm-pQrWMWes7QYnpopJcZE2GuvlmDvUEpx/pub?start=false&loop=false&delayms=3000)
13 | - [Módulo EXTRA – _Deployment_](https://docs.google.com/presentation/d/e/2PACX-1vR70Xn9nHTr1fJvewNPSBuglLvxRBrnC4iCtAThiFkpkpvgx69qK6Q6yvxgwNB96mxEUBJpQGErvMZN/pub?start=false&loop=false&delayms=3000)
14 | 
15 | El código y archivos desarrollados durante el curso pueden ser encontrados directamente en el [repositorio de GitHub](https://github.com/futurelabmx/curso-python-enes-leon) para el curso.
16 | 
17 | ## Requerimientos
18 | 
19 | 1. Instalar Python en su versión 3.8.x.
20 |    - **Si eres usuari@ de Windows:** Asegurarte de que Python es añadido al `PATH`.
21 | 2. Instalar tu editor de desarrollo favorito. Como sugerencia, te recomiendo alguno de los siguientes:
22 |    - [Visual Studio Code](https://code.visualstudio.com/)
23 |    - [Sublime Text](https://www.sublimetext.com/)
24 |    - [Atom](https://atom.io/)
25 | 3. Seguir el material del curso.
26 | 


--------------------------------------------------------------------------------
/templates/base.html:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | <html lang="en">
 3 |   <head>
 4 | 	<!-- Required meta tags -->
 5 | 	<meta charset="utf-8">
 6 | 	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 7 | 
 8 | 	<!-- Bootstrap CSS -->
 9 | 	<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
10 | 
11 | 	<!-- Custom CSS -->
12 | 	<link rel="stylesheet" href="static/mystyle.css">
13 | 	<link href="https://fonts.googleapis.com/css?family=Lato&display=swap" rel="stylesheet">
14 | 	<title>ENES-ta sección...</title>
15 |   </head>
16 |   <body>
17 | 	<!-- Navigation -->
18 | 	<nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
19 | 		<div class="container">
20 | 			<a class="navbar-brand" href="/">ENES-ta sección...</a>
21 | 			<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
22 | 			<span class="navbar-toggler-icon"></span>
23 | 			</button>
24 | 			<div class="collapse navbar-collapse" id="navbarResponsive">
25 | 			<ul class="navbar-nav ml-auto">
26 | 				<li class="nav-item">
27 | 				<a class="nav-link" href="/">Inicio</a>
28 | 				</li>
29 | 				<li class="nav-item">
30 | 				<a class="nav-link" href="/acerca-de">Acerca de</a>
31 | 				</li>
32 | 				<li class="nav-item">
33 | 				<a class="nav-link" href="/posts">Posts</a>
34 | 				</li>
35 | 				<li class="nav-item">
36 | 				<a class="nav-link" href="/contacto">Contacto</a>
37 | 				</li>
38 | 			</ul>
39 | 			</div>
40 | 		</div>
41 | 	</nav>
42 | 
43 | 		<!-- Header -->
44 | 	<header class="bg-primary py-5 mb-5">
45 | 		<div class="container h-100">
46 | 			<div class="row h-100 align-items-center">
47 | 			<div class="col-lg-12">
48 | 				<h1 class="display-4 text-white mt-5 mb-2">Business Name or Tagline</h1>
49 | 				<p class="lead mb-5 text-white-50">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Non possimus ab labore provident mollitia. Id assumenda voluptate earum corporis facere quibusdam quisquam iste ipsa cumque unde nisi, totam quas ipsam.</p>
50 | 			</div>
51 | 			</div>
52 | 		</div>
53 | 	</header>
54 | 
55 | 	{% block content %}
56 | 	{% endblock %}
57 | 
58 | 	<!-- Footer -->
59 | 	<footer class="py-5 bg-dark">
60 | 		<div class="container">
61 | 			<p class="m-0 text-center text-white">Copyright &copy; Your Website 2020</p>
62 | 		</div>
63 | 	<!-- /.container -->
64 | 	</footer>
65 | 
66 | 	<!-- Optional JavaScript -->
67 | 	<!-- jQuery first, then Popper.js, then Bootstrap JS -->
68 | 	<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
69 | 	<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
70 | 	<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
71 |   </body>
72 | </html>


--------------------------------------------------------------------------------