forked from tecladocode/web-dev-bootcamp
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request tecladocode#71 from tecladocode/jose/cou-57-sectio…
…n-7-of-the-e-book-has-almost-no
- Loading branch information
Showing
107 changed files
with
3,634 additions
and
0 deletions.
There are no files selected for viewing
1 change: 1 addition & 0 deletions
1
curriculum/section07/lectures/08_setting_up_microblog_with_flask/end/.env.example
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1 @@ | ||
| MONGODB_URI= |
3 changes: 3 additions & 0 deletions
3
curriculum/section07/lectures/08_setting_up_microblog_with_flask/end/.flaskenv
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,3 @@ | ||
| FLASK_APP=app | ||
| FLASK_ENV=development | ||
| FLASK_RUN_PORT=5002 |
1 change: 1 addition & 0 deletions
1
curriculum/section07/lectures/08_setting_up_microblog_with_flask/end/.python-version
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1 @@ | ||
| 3.9.0 |
9 changes: 9 additions & 0 deletions
9
curriculum/section07/lectures/08_setting_up_microblog_with_flask/end/app.py
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,9 @@ | ||
| from flask import Flask, render_template | ||
|
|
||
|
|
||
| app = Flask(__name__) | ||
|
|
||
|
|
||
| @app.route("/", methods=["GET"]) | ||
| def home(): | ||
| return render_template("home.html") |
3 changes: 3 additions & 0 deletions
3
curriculum/section07/lectures/08_setting_up_microblog_with_flask/end/requirements.txt
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,3 @@ | ||
| flask | ||
| python-dotenv | ||
| pymongo[srv] |
159 changes: 159 additions & 0 deletions
159
curriculum/section07/lectures/08_setting_up_microblog_with_flask/end/static/css/styles.css
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,159 @@ | ||
| html { | ||
| font-family: Lato, sans-serif; | ||
| } | ||
|
|
||
| *, | ||
| *::after, | ||
| *::before { | ||
| box-sizing: inherit; | ||
| } | ||
|
|
||
| body { | ||
| box-sizing: border-box; | ||
| margin: 0; | ||
| } | ||
|
|
||
| .navbar { | ||
| max-width: 640px; | ||
| margin: 50px auto; | ||
| padding: 0 20px; | ||
| display: flex; | ||
| flex-direction: row; | ||
| justify-content: space-between; | ||
| font-size: 24px; | ||
| } | ||
|
|
||
| .navbar__brand { | ||
| display: flex; | ||
| align-items: center; | ||
| } | ||
|
|
||
| .navbar__logo { | ||
| margin-right: 30px; | ||
| } | ||
|
|
||
| .navbar__navigation { | ||
| display: flex; | ||
| flex-direction: row; | ||
| padding: 0; | ||
| list-style: none; | ||
| color: #5c6b70; | ||
| } | ||
|
|
||
| .navbar__navigation-item { | ||
| margin-left: 50px; | ||
| } | ||
|
|
||
| .navbar__link { | ||
| text-decoration: none; | ||
| color: inherit; | ||
| } | ||
|
|
||
| .main { | ||
| max-width: 450px; | ||
| margin: 0 auto; | ||
| padding: 0 20px; | ||
| } | ||
|
|
||
| .form { | ||
| display: flex; | ||
| flex-direction: column; | ||
| align-items: flex-end; | ||
| } | ||
|
|
||
| .form__input { | ||
| width: 100%; | ||
| } | ||
|
|
||
| .form__label { | ||
| display: block; | ||
| margin-bottom: 10px; | ||
| } | ||
|
|
||
| .form__textarea { | ||
| width: inherit; | ||
| font-size: 18px; | ||
| padding: 12px 20px; | ||
| border: none; | ||
| background-color: #f3f6f6; | ||
| margin-bottom: 10px; | ||
| resize: none; | ||
| } | ||
|
|
||
| .form__submit { | ||
| background-color: #3cd0ff; | ||
| border: none; | ||
| font-size: 18px; | ||
| font-weight: bold; | ||
| padding: 5px 30px; | ||
| border-radius: 20px; | ||
| color: white; | ||
| cursor: pointer; | ||
| } | ||
|
|
||
| .form__submit:hover { | ||
| background-color: #18c1e1; | ||
| } | ||
|
|
||
| .entry { | ||
| margin-top: 50px; | ||
| } | ||
|
|
||
| .entry__title { | ||
| display: inline; | ||
| font-size: 18px; | ||
| } | ||
|
|
||
| .entry__date { | ||
| color: #5c6b70; | ||
| } | ||
|
|
||
| .entry__content { | ||
| font-size: 16px; | ||
| line-height: 150%; | ||
| } | ||
|
|
||
| .footer { | ||
| background-color: #323f43; | ||
| padding: 40px 0; | ||
| margin-top: 50px; | ||
| border-top: 4px solid black; | ||
| color: white; | ||
| font-size: 12px; | ||
| } | ||
|
|
||
| .footer__content { | ||
| max-width: 640px; | ||
| margin: 0 auto; | ||
| padding: 0 20px; | ||
| display: flex; | ||
| flex-direction: row; | ||
| } | ||
|
|
||
| .footer .left { | ||
| flex-grow: 2; | ||
| display: flex; | ||
| flex-direction: column; | ||
| } | ||
|
|
||
| .footer .right { | ||
| flex-grow: 1; | ||
| display: flex; | ||
| flex-direction: row; | ||
| } | ||
|
|
||
| .footer__column { | ||
| display: flex; | ||
| flex-direction: column; | ||
| margin-left: 50px; | ||
| } | ||
|
|
||
| .footer__item { | ||
| margin-bottom: 5px; | ||
| color: inherit; | ||
| text-decoration: none; | ||
| } | ||
|
|
||
| .footer__item:hover { | ||
| text-decoration: underline; | ||
| } |
5 changes: 5 additions & 0 deletions
5
...culum/section07/lectures/08_setting_up_microblog_with_flask/end/static/logo.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
66 changes: 66 additions & 0 deletions
66
curriculum/section07/lectures/08_setting_up_microblog_with_flask/end/templates/home.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,66 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <title>Microblog</title> | ||
| <link rel="stylesheet" href="/static/css/styles.css" /> | ||
| </head> | ||
| <body> | ||
| <header class="navbar"> | ||
| <div class="navbar__brand"> | ||
| <img class="navbar__logo" src="/static/logo.svg" alt="The Microblog logo" />Microblog | ||
| </div> | ||
| <ul class="navbar__navigation"> | ||
| <li class="navbar__navigation-item"> | ||
| <a href="#" class="navbar__link">Recent</a> | ||
| </li> | ||
| <li class="navbar__navigation-item"> | ||
| <a href="#" class="navbar__link">Calendar</a> | ||
| </li> | ||
| </ul> | ||
| </header> | ||
| <main class="main"> | ||
| <section> | ||
| <h1>Add new entry</h1> | ||
| <form class="form" action="/entry" method="POST"> | ||
| <p class="form__input"> | ||
| <label for="entry" class="form__label">Entry contents:</label> | ||
| <textarea name="content" id="entry" class="form__textarea"></textarea> | ||
| </p> | ||
| <button type="submit" class="form__submit">Add entry</button> | ||
| </form> | ||
| </section> | ||
| <section> | ||
| <h1>Recent posts</h1> | ||
| <article class="entry"> | ||
| <div> | ||
| <h2 class="entry__title">A bit of a chill day today</h2> | ||
| <time class="entry__date" datetime="24-10-2019">• Oct 24</time> | ||
| </div> | ||
| <p class="entry__content"> | ||
| Today I couldn't do much programming, but that's OK! Can't be too awesome every day now! | ||
| </p> | ||
| </article> | ||
| </section> | ||
| </main> | ||
| <footer class="footer"> | ||
| <div class="footer__content"> | ||
| <section class="left"> | ||
| <a class="footer__item">Made by Jose Salvatierra</a> | ||
| <a class="footer__item">Check out my other projects</a> | ||
| </section> | ||
| <section class="right"> | ||
| <div class="footer__column"> | ||
| <a class="footer__item">Recent</a> | ||
| <a class="footer__item">Calendar</a> | ||
| </div> | ||
| <div class="footer__column"> | ||
| <a class="footer__item" href="#">About</a> | ||
| <a class="footer__item">How this was made</a> | ||
| </div> | ||
| </section> | ||
| </div> | ||
| </footer> | ||
| </body> | ||
| </html> |
66 changes: 66 additions & 0 deletions
66
curriculum/section07/lectures/08_setting_up_microblog_with_flask/start/home.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,66 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <title>Microblog</title> | ||
| <link rel="stylesheet" href="styles.css" /> | ||
| </head> | ||
| <body> | ||
| <header class="navbar"> | ||
| <div class="navbar__brand"> | ||
| <img class="navbar__logo" src="logo.svg" alt="The Microblog logo" />Microblog | ||
| </div> | ||
| <ul class="navbar__navigation"> | ||
| <li class="navbar__navigation-item"> | ||
| <a href="#" class="navbar__link">Recent</a> | ||
| </li> | ||
| <li class="navbar__navigation-item"> | ||
| <a href="#" class="navbar__link">Calendar</a> | ||
| </li> | ||
| </ul> | ||
| </header> | ||
| <main class="main"> | ||
| <section> | ||
| <h1>Add new entry</h1> | ||
| <form class="form" action="/entry" method="POST"> | ||
| <p class="form__input"> | ||
| <label for="entry" class="form__label">Entry contents:</label> | ||
| <textarea name="content" id="entry" class="form__textarea"></textarea> | ||
| </p> | ||
| <button type="submit" class="form__submit">Add entry</button> | ||
| </form> | ||
| </section> | ||
| <section> | ||
| <h1>Recent posts</h1> | ||
| <article class="entry"> | ||
| <div> | ||
| <h2 class="entry__title">A bit of a chill day today</h2> | ||
| <time class="entry__date" datetime="24-10-2019">• Oct 24</time> | ||
| </div> | ||
| <p class="entry__content"> | ||
| Today I couldn't do much programming, but that's OK! Can't be too awesome every day now! | ||
| </p> | ||
| </article> | ||
| </section> | ||
| </main> | ||
| <footer class="footer"> | ||
| <div class="footer__content"> | ||
| <section class="left"> | ||
| <a class="footer__item">Made by Jose Salvatierra</a> | ||
| <a class="footer__item">Check out my other projects</a> | ||
| </section> | ||
| <section class="right"> | ||
| <div class="footer__column"> | ||
| <a class="footer__item">Recent</a> | ||
| <a class="footer__item">Calendar</a> | ||
| </div> | ||
| <div class="footer__column"> | ||
| <a class="footer__item" href="#">About</a> | ||
| <a class="footer__item">How this was made</a> | ||
| </div> | ||
| </section> | ||
| </div> | ||
| </footer> | ||
| </body> | ||
| </html> |
5 changes: 5 additions & 0 deletions
5
curriculum/section07/lectures/08_setting_up_microblog_with_flask/start/logo.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Oops, something went wrong.