├── README.md ├── img └── git.png ├── index.html ├── index.js └── style.css /README.md: -------------------------------------------------------------------------------- 1 | # Curso Git 2 | 3 | Curso Git Mastermind 4 | 5 | Version 1 -------------------------------------------------------------------------------- /img/git.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mastermindac/curso-git/c8c2dd13ca4f412783e226133fa25a96145ebfa0/img/git.png -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | Blog Curso Git 13 | 14 | 15 |
16 | 17 |

Blog Curso Git & Github

18 |
19 |
20 | Aqui ira la publicidad 21 |
22 |
23 | 24 |
25 | 26 | 27 | 28 | 29 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | const url = "https://jsonplaceholder.typicode.com"; 2 | 3 | const getUser = async (id) => { 4 | const res = await fetch(`${url}/users?id=${id}`); 5 | const user = (await res.json())[0]; 6 | 7 | return user; 8 | } 9 | 10 | const getPosts = async (user) => { 11 | const res = await fetch(`${url}/posts?userId=${user.id}&_limit=3`) 12 | const posts = await res.json(); 13 | 14 | return posts; 15 | } 16 | 17 | const getCommentsForEachPost = async (posts) => { 18 | const res = await Promise.all(posts.map(post => 19 | fetch(`${url}/comments?postId=${post.id}&_limit=4`) 20 | )); 21 | console.log(res); 22 | const postComments = await Promise.all(res.map(r => r.json())); 23 | 24 | postComments.forEach((comments, i) => posts[i].comments = comments); 25 | } 26 | 27 | const renderHtml = (user, posts) => { 28 | const content = document.getElementById('content'); 29 | content.innerHTML += `

Posts del usuario ${user.email}

`; 30 | 31 | posts.forEach(post => { 32 | content.innerHTML += ` 33 |
34 |

${post.title}

35 |

${post.body}

36 |
37 | ${post.comments.map(c => `

${c.email}:${c.body}

`).join('')} 38 |
39 | `; 40 | }) 41 | } 42 | 43 | const getBlogContent = async () => { 44 | try { 45 | const user = await getUser(1); 46 | const posts = await getPosts(user); 47 | await getCommentsForEachPost(posts); 48 | 49 | renderHtml(user, posts); 50 | } catch (err) { 51 | console.log(err); 52 | } 53 | } 54 | 55 | getBlogContent(); 56 | 57 | const loadAdds = () => { 58 | console.log('Adds loaded'); 59 | } 60 | 61 | const affiliateRedirect = () => { 62 | // resolver el bug 63 | } 64 | 65 | // test commit 66 | 67 | // cambio 1 68 | // cambio 2 69 | // cambio 3 70 | 71 | // cambios videos 1 72 | // cambios videos 2 73 | // cambios videos 3 -------------------------------------------------------------------------------- /style.css: -------------------------------------------------------------------------------- 1 | body { 2 | background-color: #1d2127; 3 | color: #fff; 4 | font-family: "Overpass Mono", monospace; 5 | padding: 0; 6 | margin: 0; 7 | } 8 | 9 | h1 { 10 | margin: 0 0 0 8px; 11 | padding-top: 8px; 12 | } 13 | 14 | .bar { 15 | background-color: #464b55; 16 | padding: 10px; 17 | display: flex; 18 | } 19 | 20 | .logo { 21 | width: 50px; 22 | height: 50px; 23 | } 24 | 25 | .container { 26 | margin-top: 30px; 27 | padding: 0 60px 0 60px; 28 | } 29 | 30 | .post { 31 | background-color: #282c34; 32 | margin-bottom: 15px; 33 | padding: 5px 20px 5px 20px; 34 | border-radius: 12px; 35 | } 36 | 37 | .post h4 { 38 | color: #98c379; 39 | } 40 | 41 | .post span { 42 | color: #61afef; 43 | } 44 | --------------------------------------------------------------------------------