{"id":1384,"date":"2024-09-19T11:32:12","date_gmt":"2024-09-19T14:32:12","guid":{"rendered":"https:\/\/desvendandoocodigo.com.br\/?p=1384"},"modified":"2024-09-19T11:32:42","modified_gmt":"2024-09-19T14:32:42","slug":"resumo-da-live-tiktok-19-09-2024","status":"publish","type":"post","link":"https:\/\/desvendandoocodigo.com.br\/?p=1384","title":{"rendered":"Resumo da Live TikTok 19\/09\/2024"},"content":{"rendered":"\n

Ol\u00e1 Pessoal! <\/h2>\n\n\n\n

Na Live do dia 19\/09\/2024 bordamos o tema: Cria\u00e7\u00e3o de elementos HTML com JavaScript e Json.<\/h2>\n\n\n\n
carros.json\n[\n    {\n        \"nome\": \"CARRO1\",\n        \"imagem\": \"img\/carro1.jpg\"\n    },\n    {\n        \"nome\": \"CARRO2\",\n        \"imagem\": \"img\/carro2.jpg\"\n    },\n    {\n        \"nome\": \"CARRO3\",\n        \"imagem\": \"img\/carro3.jpg\"\n    },\n    {\n        \"nome\": \"CARRO4\",\n        \"imagem\": \"img\/carro4.jpg\"\n    },\n    {\n        \"nome\": \"CARRO5\",\n        \"imagem\": \"img\/carro5.jpg\"\n    }\n\n]\n\ncss\n*{\n    margin: 0;\n    padding: 0;\n    box-sizing: border-box;\n}\nbody{\n\n    font-family: Arial, Helvetica, sans-serif;\n    background-color: #1c1c1c;\n    color: #f0f0f0;\n}\n\n.container{\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: space-around;\n    padding: 20px;\n}\n\n.card{\n    background-color: #2d2d2d;\n    border: 2px solid #ff0000;\n    border-radius: 8px;\n    padding: 16px;\n    margin: 15px;\n    width: 230px;\n    text-align: center;\n    transition: transform 0.3s ease;\n}\n.card:hover{\n    transform: scale(1.05);\n}\n\n.card img{\n    max-width: 100%;\n    height: 150px;\n    border-radius: 8px;\n    margin-bottom: 10px;\n}\n.card h3{\n    font-size: 1.2em;\n    margin-top: 10px;\n    color: #ffcc00;\n}\n.card p{\n    color: #ccc;\n}\n\n\nhtml\n\n<!DOCTYPE html>\n<html lang=\"pt-br\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>Mini Projeto Com Json<\/title>\n    <link rel=\"stylesheet\" href=\"style.css\">\n<\/head>\n<body>\n    <div class=\"container\" id=\"carros-container\">\n      <!--  <div class=\"card\">\n            <img src=\"img\/carro1.jpg\" alt=\"\">\n            <h3>CARRO1<\/h3>\n        <\/div>-->    \n    <\/div>\n\n    <script>\n\n        function carregar(){\n\n            fetch('carros.json')\n                .then(response => response.json())\n                .then(carros =>{\n                const container = \n                document.querySelector('#carros-container');\n\n                carros.map(carro=>{\n\n                const card = document.createElement(\"div\");\n                card.classList.add(\"card\");\n\n                const img = document.createElement(\"img\");\n\n                img.src = carro.imagem;\n\n                img.alt = carro.nome;\n\n                const titulo = document.createElement(\"h3\");\n                titulo.textContent = carro.nome;\n\n                card.appendChild(img);\n                card.appendChild(titulo);\n                container.appendChild(card);\n\n                });\n\n            });\n\n        }\n\n        carregar();\n    <\/script>\n<\/body>\n<\/html>\n\n\n<\/code><\/pre>\n\n\n\n
\"\"<\/figure>\n\n\n\n
<\/p>\n\n\n\n
https:\/\/go.hotmart.com\/V89811082M?dp=1<\/a><\/p>\n\n\n\n
https:\/\/go.hotmart.com\/X90111663X?dp=1<\/a><\/p>\n\n\n\n
\n\n\n\n
HOR\u00c1RIO DAS LIVES<\/strong><\/h2>\n\n\n\n
Domingo – Segunda e Quarta \u00e0s 19:00hs<\/p>\n\n\n\n
Quinta – Sexta e S\u00e1bado \u00e0s 10:00hs<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
<\/p>\n","protected":false},"excerpt":{"rendered":"
Ol\u00e1 Pessoal! Na Live do dia 19\/09\/2024 bordamos o tema: Cria\u00e7\u00e3o de elementos HTML com JavaScript e Json. https:\/\/go.hotmart.com\/V89811082M?dp=1 https:\/\/go.hotmart.com\/X90111663X?dp=1 HOR\u00c1RIO DAS LIVES Domingo – Segunda e Quarta \u00e0s 19:00hs Quinta – Sexta e S\u00e1bado \u00e0s 10:00hs<\/p>\n","protected":false},"author":1,"featured_media":1097,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[18],"tags":[],"_links":{"self":[{"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=\/wp\/v2\/posts\/1384"}],"collection":[{"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1384"}],"version-history":[{"count":2,"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=\/wp\/v2\/posts\/1384\/revisions"}],"predecessor-version":[{"id":1386,"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=\/wp\/v2\/posts\/1384\/revisions\/1386"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=\/wp\/v2\/media\/1097"}],"wp:attachment":[{"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1384"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1384"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/desvendandoocodigo.com.br\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1384"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}