diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..c6bba59
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,130 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+lerna-debug.log*
+.pnpm-debug.log*
+
+# Diagnostic reports (https://nodejs.org/api/report.html)
+report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+*.lcov
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+# Snowpack dependency directory (https://snowpack.dev/)
+web_modules/
+
+# TypeScript cache
+*.tsbuildinfo
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional stylelint cache
+.stylelintcache
+
+# Microbundle cache
+.rpt2_cache/
+.rts2_cache_cjs/
+.rts2_cache_es/
+.rts2_cache_umd/
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variable files
+.env
+.env.development.local
+.env.test.local
+.env.production.local
+.env.local
+
+# parcel-bundler cache (https://parceljs.org/)
+.cache
+.parcel-cache
+
+# Next.js build output
+.next
+out
+
+# Nuxt.js build / generate output
+.nuxt
+dist
+
+# Gatsby files
+.cache/
+# Comment in the public line in if your project uses Gatsby and not Next.js
+# https://nextjs.org/blog/next-9-1#public-directory-support
+# public
+
+# vuepress build output
+.vuepress/dist
+
+# vuepress v2.x temp and cache directory
+.temp
+.cache
+
+# Docusaurus cache and generated files
+.docusaurus
+
+# Serverless directories
+.serverless/
+
+# FuseBox cache
+.fusebox/
+
+# DynamoDB Local files
+.dynamodb/
+
+# TernJS port file
+.tern-port
+
+# Stores VSCode versions used for testing VSCode extensions
+.vscode-test
+
+# yarn v2
+.yarn/cache
+.yarn/unplugged
+.yarn/build-state.yml
+.yarn/install-state.gz
+.pnp.*
diff --git a/Components/Card/card.js b/Components/Card/card.js
deleted file mode 100644
index bb1a770..0000000
--- a/Components/Card/card.js
+++ /dev/null
@@ -1,71 +0,0 @@
-const _className = {
- card: 'card',
- image: 'card__image',
- textContainer: 'card__text',
- title: 'card__headline',
- text: 'card__content',
- button: 'card__button'
-};
-
-export default class Card {
-
- constructor() {
- }
-
- static create(_title, _text, _url, _image) {
- const card = document.createElement('div');
- card.className = _className.card;
-
- if (_image) {
- this.addImg(card, _image);
- }
-
- this.addText(card, _title, _text)
- this.addBtn(card, 'Acessar', _url);
-
- return card;
- }
-
- static addImg(card, _image) {
- const image = document.createElement('img');
- image.src = _image.src;
- image.alt = _image.alt;
- image.className = _className.image;
-
- card.appendChild(image);
-
- return null;
- }
-
- static addText(card, _title, _text) {
- const container = document.createElement('div');
- container.className = _className.textContainer;
-
- const title = document.createElement('h3');
- title.className = _className.title;
- title.innerHTML = _title;
-
- const text = document.createElement('p');
- text.className = _className.text;
- text.innerHTML = _text;
-
- container.append(title, text);
-
- card.appendChild(container);
-
- return null;
- }
-
- static addBtn(card, _text, _anchor) {
- const button = document.createElement('a');
- button.className = _className.button;
- button.innerHTML = _text;
-
- _anchor ? button.href = _anchor : button.href = '#';
-
- card.appendChild(button);
-
- return null;
- }
-
-}
\ No newline at end of file
diff --git a/Components/Card/card.json b/Components/Card/card.json
deleted file mode 100644
index 845830a..0000000
--- a/Components/Card/card.json
+++ /dev/null
@@ -1,101 +0,0 @@
-[
- {
- "tit": "ADMINSTRAÇÃO",
- "desc": "Domine as habilidades essenciais de gestão e liderança para impulsionar o sucesso em diversos setores empresariais.",
- "url": "./cursos/adm.html",
- "img": {
- "src": "./imgs/fiap.png",
- "alt": "FIAP"
- }
- },
- {
- "tit": "ANÁLISE E DESENVOLVIMENTO DE SISTEMAS",
- "desc": "Aprenda a projetar, desenvolver e implementar soluções de software inovadoras para atender às demandas do mercado digital em constante evolução.",
- "url": "./cursos/ads.html",
- "img": {
- "src": "./imgs/fiap.png",
- "alt": "FIAP"
- }
- },
- {
- "tit": "BANCO DE DADOS",
- "desc": "Torne-se especialista na gestão eficiente e segura de grandes volumes de dados, preparando-se para atuar em projetos de bancos de dados complexos.",
- "url": "./cursos/banco-de-dados.html",
- "img": {
- "src": "./imgs/fiap.png",
- "alt": "FIAP"
- }
- },
- {
- "tit": "ENGENHARIA DA COMPUTAÇÃO",
- "desc": "Explore o mundo da tecnologia de hardware e software, desenvolvendo habilidades para criar sistemas computacionais avançados e inovadores.",
- "url": "./cursos/engenharia-da-computacao.html",
- "img": {
- "src": "./imgs/fiap.png",
- "alt": "FIAP"
- }
- },
- {
- "tit": "ENGENHARIA DA MECATRÔNICA",
- "desc": "Integre conhecimentos de engenharia mecânica, eletrônica e de controle para projetar e construir sistemas automatizados e robóticos.",
- "url": "./cursos/engenharia-da-mecatronica.html",
- "img": {
- "src": "./imgs/fiap.png",
- "alt": "FIAP"
- }
- },
- {
- "tit": "ENGENHARIA DA PRODUÇÃO",
- "desc": "Adquira expertise em otimização de processos, gestão de recursos e logística para aumentar a eficiência e a qualidade na produção industrial.",
- "url": "./cursos/engenharia-da-producao.html",
- "img": {
- "src": "./imgs/fiap.png",
- "alt": "FIAP"
- }
- },
- {
- "tit": "GESTÃO DE TECNOLOGIA DA INFORMAÇÃO",
- "desc": "Desenvolva competências para gerir recursos tecnológicos de forma estratégica, alinhando a TI aos objetivos de negócio da organização.",
- "url": "./cursos/gestao-de-tecnologia-da-informacao.html",
- "img": {
- "src": "./imgs/fiap.png",
- "alt": "FIAP"
- }
- },
- {
- "tit": "JOGOS DIGITAIS",
- "desc": "Entre no universo criativo dos jogos digitais, aprendendo a projetar, desenvolver e publicar jogos envolventes para diversas plataformas.",
- "url": "./cursos/jogos-digitais.html",
- "img": {
- "src": "./imgs/fiap.png",
- "alt": "FIAP"
- }
- },
- {
- "tit": "REDE DE COMPUTADORES",
- "desc": "Aprofunde-se na arquitetura, configuração e segurança de redes de computadores, preparando-se para atuar na administração e manutenção de infraestruturas de rede.",
- "url": "./cursos/rede-de-computadores.html",
- "img": {
- "src": "./imgs/fiap.png",
- "alt": "FIAP"
- }
- },
- {
- "tit": "SISTEMAS DA INFORMAÇÃO",
- "desc": "Desenvolva habilidades para analisar, projetar e implementar sistemas de informação eficientes, integrando tecnologia e processos de negócio.",
- "url": "./cursos/sistemas-da-informacao.html",
- "img": {
- "src": "./imgs/fiap.png",
- "alt": "FIAP"
- }
- },
- {
- "tit": "SISTEMAS PARA INTERNET",
- "desc": "Explore as tecnologias web mais recentes, aprendendo a desenvolver aplicações web dinâmicas e interativas para atender às demandas do mercado online.",
- "url": "./cursos/sistemas-para-internet.html",
- "img": {
- "src": "./imgs/fiap.png",
- "alt": "FIAP"
- }
- }
-]
diff --git a/Components/Card/index.js b/Components/Card/index.js
deleted file mode 100644
index 45ba1c6..0000000
--- a/Components/Card/index.js
+++ /dev/null
@@ -1,29 +0,0 @@
-import Card from './card.js';
-
-function obterDadosDoJSON() {
- return fetch('../Components/Card/card.json')
- .then(response => {
- if (!response.ok) throw new Error('Erro ao carregar o arquivo JSON');
- return response.json();
- })
- .catch(error => console.error('Erro:', error));
-}
-
-const section = document.body.querySelector('.section--cards');
-
-if (section) {
- obterDadosDoJSON()
- .then(data => {
- data.map(
- materia => section.appendChild(
- Card.create(
- materia.tit,
- materia.desc,
- materia.url,
- materia.img
- )
- )
- )
- })
- .catch(error => console.error("ERRO: " + error));
-}
\ No newline at end of file
diff --git a/Components/Curso/curso.js b/Components/Curso/curso.js
deleted file mode 100644
index 5f4ccc9..0000000
--- a/Components/Curso/curso.js
+++ /dev/null
@@ -1,70 +0,0 @@
-const _className = {
- title: 'cursos__title',
- textContainer: 'cursos__text-container',
- text: 'cursos__text',
- nav: 'cursos__nav',
- link: 'link'
-};
-
-export default class Curso {
-
- static create(_title, _text, _nav) {
- const curso = document.querySelector('.cursos');
-
- this.addTitle(curso, _title);
- this.addText(curso, _text);
- this.addNav(curso, _nav);
-
- return curso;
- }
-
- static addTitle(curso, _title) {
- const title = document.createElement('h2');
- title.className = _className.title;
- title.innerHTML = _title;
-
- curso.appendChild(title);
- return null;
- }
-
- static addText(curso, _container) {
- const container = document.createElement('div');
- container.className = _className.textContainer;
-
- _container.map(_text => {
-
- const text = document.createElement('p');
- text.innerHTML = _text;
- container.appendChild(text);
-
- })
-
- curso.appendChild(container);
- return null;
- }
-
- static addNav(curso, _nav) {
- const container = document.createElement('nav');
- container.className = _className.nav;
-
- if (_nav.prev) {
- const prev = document.createElement('a');
- prev.className = _className.link;
- prev.href = _nav.prev;
- prev.innerHTML = "Curso Anterior";
- container.appendChild(prev)
- }
-
- if (_nav.next) {
- const next = document.createElement('a');
- next.className = _className.link;
- next.href = _nav.next;
- next.innerHTML = "Próximo Curso";
- container.appendChild(next)
- }
-
- curso.appendChild(container);
- return null;
- }
-
-}
\ No newline at end of file
diff --git a/Components/Curso/index.js b/Components/Curso/index.js
deleted file mode 100644
index acaf796..0000000
--- a/Components/Curso/index.js
+++ /dev/null
@@ -1,44 +0,0 @@
-import Curso from "./curso.js";
-
-function obterDadosDoJSON() {
- return fetch('../Components/Curso/cursos.json')
- .then(response => {
- if (!response.ok) throw new Error('Erro ao carregar o arquivo JSON');
- return response.json();
- })
- .catch(error => console.error('Erro:', error));
-}
-
-const sections = [
- document.getElementById('curso-adm'),
- document.getElementById('curso-ads'),
- document.getElementById('curso-bd'),
- document.getElementById('curso-engComp'),
- document.getElementById('curso-engMec'),
- document.getElementById('curso-engProd'),
- document.getElementById('curso-gestTecInf'),
- document.getElementById('curso-jogos'),
- document.getElementById('curso-redeComp'),
- document.getElementById('curso-sistInf'),
- document.getElementById('curso-sistNet')
-];
-
-obterDadosDoJSON()
- .then(data => {
-
- sections.map((sect, i) => {
- if (sect) {
- sect.appendChild(
- Curso.create(
- data[i].title,
- data[i].text,
- data[i].nav
- )
- )
-
- }
- })
-
- })
- .catch(error => console.error("ERRO: " + error));
-
diff --git a/Components/Curso/cursos.json b/Components/base/cursos.json
similarity index 74%
rename from Components/Curso/cursos.json
rename to Components/base/cursos.json
index f05ddd5..ce56604 100644
--- a/Components/Curso/cursos.json
+++ b/Components/base/cursos.json
@@ -1,18 +1,22 @@
[
{
"title": "Adminstração",
+ "desc": "Domine as habilidades essenciais de gestão e liderança para impulsionar o sucesso em diversos setores empresariais.",
"text": [
- "A FIAP tem o melhor curso de Administração de São Paulo, primeiro colocado no ENADE. Isso é consequência de um ambiente de excelência em tecnologia, inovação e empreendedorismo, que desperta nos alunos o pensamento crítico, engajamento social e os prepara para o mercado de trabalho.",
- "O curso aborda tanto o lado gerencial quanto o lado estratégico de negócios, em disciplinas como: negociação, liderança e trabalho em equipe, direito empresarial, gestão financeira, gestão de pessoas, marketing, processos e gestão de TI.",
- "Você será capaz de apoiar e conduzir os principais planos de uma empresa em cenários dinâmicos, competitivos e tecnológicos."
+ "A FIAP tem o melhor curso de Administração de São Paulo, primeiro colocado no ENADE. Isso é consequência de um ambiente de excelência em tecnologia, inovação e empreendedorismo, que desperta nos alunos o pensamento crítico, engajamento social e os prepara para o mercado de trabalho.",
+ "O curso aborda tanto o lado gerencial quanto o lado estratégico de negócios, em disciplinas como: negociação, liderança e trabalho em equipe, direito empresarial, gestão financeira, gestão de pessoas, marketing, processos e gestão de TI.",
+ "Você será capaz de apoiar e conduzir os principais planos de uma empresa em cenários dinâmicos, competitivos e tecnológicos."
],
"nav": {
"prev": "",
"next": "./ads.html"
- }
+ },
+ "url": "./cursos/adm.html",
+ "idPage": "curso-adm"
},
{
"title": "Análise e Desenvolvimento de Sistemas",
+ "desc": "Aprenda a projetar, desenvolver e implementar soluções de software inovadoras para atender às demandas do mercado digital em constante evolução.",
"text": [
"Você vai aprender a identificar as necessidades estruturais de um sistema, documentar, criar protótipos e desenvolver para web e mobile utilizando os principais softwares, ferramentas e metodologias do mercado, além de ser capaz de gerenciar projetos e controlar a qualidade de programas.",
"O curso aborda tanto o lado gerencial quanto o lado estratégico de negócios, em disciplinas como: negociação, liderança e trabalho em equipe, direito empresarial, gestão financeira, gestão de pessoas, marketing, processos e gestão de TI.",
@@ -21,10 +25,13 @@
"nav": {
"prev": "./adm.html",
"next": "./banco-de-dados.html"
- }
+ },
+ "url": "./cursos/ads.html",
+ "idPage": "curso-ads"
},
{
"title": "Banco de Dados",
+ "desc": "Torne-se especialista na gestão eficiente e segura de grandes volumes de dados, preparando-se para atuar em projetos de bancos de dados complexos.",
"text": [
"Tecnologia em Banco de Dados prepara você para entender e utilizar melhor os dados, criando soluções inovadoras a partir de um fluxo de conteúdo monitorado e analisado.",
"E personalizando os serviços prestados por meio da construção de bases de dados para tomada de decisão e aplicação dos conceitos de BI (Business Intelligence) relacionados à modelagem de indicadores de desempenho, integração de dados corporativos e visualização das informações.",
@@ -34,10 +41,13 @@
"nav": {
"prev": "./ads.html",
"next": "./engenharia-da-computacao.html"
- }
+ },
+ "url": "./cursos/banco-de-dados.html",
+ "idPage": "curso-bd"
},
{
"title": "Engenharia da Computação",
+ "desc": "Explore o mundo da tecnologia de hardware e software, desenvolvendo habilidades para criar sistemas computacionais avançados e inovadores.",
"text": [
"O ENGENHEIRO DA COMPUTAÇÃO desenvolve projetos nas áreas de sistemas operacionais, arquitetura de computadores, redes, robótica e inteligência artificial.",
"A grade privilegia conhecimentos avançados na área de exatas (física e matemática) e aspectos de eletrônica, controle e automação, telecomunicações e TI.",
@@ -47,10 +57,13 @@
"nav": {
"prev": "./banco-de-dados.html",
"next": "./engenharia-da-mecatronica.html"
- }
+ },
+ "url": "./cursos/engenharia-da-computacao.html",
+ "idPage": "curso-engComp"
},
{
"title": "Engenharia da Mecatrônica",
+ "desc": "Integre conhecimentos de engenharia mecânica, eletrônica e de controle para projetar e construir sistemas automatizados e robóticos.",
"text": [
"É uma das profissões mais promissoras do mercado, tanto em época de crise como em momentos positivos da economia.",
"Para ganhar competitividade, toda empresa precisa desenvolver e implantar sistemas automatizados, utilizando tecnologias exponenciais.",
@@ -61,22 +74,28 @@
"nav": {
"prev": "./engenharia-da-computacao.html",
"next": "./engenharia-da-producao.html"
- }
+ },
+ "url": "./cursos/engenharia-da-mecatronica.html",
+ "idPage": "curso-engMec"
},
{
"title": "Engenharia da Produção",
+ "desc": "Adquira expertise em otimização de processos, gestão de recursos e logística para aumentar a eficiência e a qualidade na produção industrial.",
"text": [
- "O ENGENHEIRO DE PRODUÇÃO reúne conhecimentos das áreas de administração, economia e engenharia. O curso foi planejado para incorporar a influência de ferramentas tecnológic indispensáveis para gestão de negócios.",
+ "O ENGENHEIRO DE PRODUÇÃO reúne conhecimentos das áreas de administração, economia e engenharia. O curso foi planejado para incorporar a influência de ferramentas tecnológic indispensáveis para gestão de negócios.",
"A grade privilegia conhecimentos avançados na área de exatas (matemáti ciência e tecnologia) e à formação em aspectos políticos, sociais, ambientais, culturais e de sustentabilidade.",
"Na FIAP, o futuro engenheiro dispõe de um parque tecnológico avança laboratórios de química, informática, fabricação e o Maker Labs, onde você pode ir da ideia ao protótipo, uni práticas multidisciplinares de mecânica, eletrônica e tecnologia, com impressoras 3D, usinagem, cortadoras lase fresadoras de precisão."
],
"nav": {
"prev": "./engenharia-da-mecatronica.html",
"next": "./gestao-de-tecnologia-da-informacao.html"
- }
+ },
+ "url": "./cursos/engenharia-da-producao.html",
+ "idPage": "curso-engProd"
},
{
"title": "Gestão de Tecnologia da Informação",
+ "desc": "Desenvolva competências para gerir recursos tecnológicos de forma estratégica, alinhando a TI aos objetivos de negócio da organização.",
"text": [
"Você vai planejar e gerenciar sistemas computacionais (hardware) e de informação (software) nas áreas de processos, mobilidade, segurança, tecnologias emergentes, sistemas integrados, big data, cloud computing, engenharia de software, marketing digital e redes sociais.",
"O curso traz uma abordagem equilibrada entre o conhecimento técnico e de gestão, unindo conhecimento base de plataformas de desenvolvimento com metodologias de projetos.",
@@ -85,10 +104,13 @@
"nav": {
"prev": "./engenharia-da-producao.html",
"next": "./jogos-digitais.html"
- }
+ },
+ "url": "./cursos/gestao-de-tecnologia-da-informacao.html",
+ "idPage": "curso-gestTecInf"
},
{
"title": "Jogos Digitais",
+ "desc": "Entre no universo criativo dos jogos digitais, aprendendo a projetar, desenvolver e publicar jogos envolventes para diversas plataformas.",
"text": [
"Você vai ser preparado para desenvolver jogos em todas as plataformas: internet, consoles (Playstation, Xbox e Nintendo), smartphones (aplicativos para celulares e tablets), desktops (PC e Mac), TV digital, simuladores de realidade virtual e virtualizações (totem tour virtual).",
"Você vai aprender a idealizar e desenvolver um jogo desde o enredo, passando pela criação de personagens, conceitos de gameficação, ambientes e objetos de cenários.",
@@ -99,10 +121,13 @@
"nav": {
"prev": "./gestao-de-tecnologia-da-informacao.html",
"next": "./rede-de-computadores.html"
- }
+ },
+ "url": "./cursos/jogos-digitais.html",
+ "idPage": "curso-jogos"
},
{
"title": "Rede de Computadores",
+ "desc": "Aprofunde-se na arquitetura, configuração e segurança de redes de computadores, preparando-se para atuar na administração e manutenção de infraestruturas de rede.",
"text": [
"É ministrado em um ambiente que simula uma empresa real, com computadores (SO Linux e Windows), roteadores, switches, cabeamento e demais equipamentos, trazendo a vivência que você precisa para ser competitivo no mercado de trabalho.",
"Você vai aprender a dimensionar o uso de equipamentos multiusuários. Configurar acesso e disponibilidade para internet e intranet, roteadores e provedores. Trabalhar com sistemas de gerenciamento de redes, sistemas operacionais e simulação de ambiente de Cloud Computing. E com os novos conhecimentos sobre hardware, software e modos de funcionamento, também vai ser capaz de otimizar o desempenho dos computadores, adequando a estrutura física ao seu potencial de produção, o que aumenta o desempenho. Tudo isso de acordo com as regras de segurança."
@@ -110,12 +135,15 @@
"nav": {
"prev": "./jogos-digitais.html",
"next": "./sistemas-da-informacao.html"
- }
+ },
+ "url": "./cursos/rede-de-computadores.html",
+ "idPage": "curso-redeComp"
},
{
"title": "Sistemas da Informação",
+ "desc": "Desenvolva habilidades para analisar, projetar e implementar sistemas de informação eficientes, integrando tecnologia e processos de negócio.",
"text": [
- "O BACHAREL EM SISTEMAS DE INFORMAÇÃO recebe uma visão ampla das organizações e seus modelos de negócio e de como a tecnologia pode amplificar sua estratégia.",
+ "O BACHAREL EM SISTEMAS DE INFORMAÇÃO recebe uma visão ampla das organizações e seus modelos de negócio e de como a tecnologia pode amplificar sua estratégia.",
"Com conteúdo que vai de hardware a inteligência artificial, passando por gestão empresarial, o curso abrange conhecimentos de desenvolvimento de aplicativos (mobile, games e web), engenharia de software e governança de TI, banco de dados, redes, business intelligence, análise de sistemas orientados a objetos, gestão de SI, gerência de projetos e segurança da informação.",
"A grade foi desenvolvida para que, desde o primeiro ano, os alunos recebam a base necessária para atuarem na área de TI de grandes empresas, resolvendo problemas por meio de raciocínio lógico e buscando solução para os desafios das organizações.",
"Pensar de uma forma digital não é mais uma tendência: é uma estratégia de inovação e de geração de negócios. O acesso à Internet banda larga aumentou 55% em 2015, totalizando 133,7 milhões de acessos, segundo a Telebrasil. Números que ampliam a importância de um tecnólogo não só voltado para a Internet, mas que também domine as novas tecnologias e metodologias que estão surgindo.",
@@ -124,10 +152,13 @@
"nav": {
"prev": "./rede-de-computadores.html",
"next": "./sistemas-para-internet.html"
- }
+ },
+ "url": "./cursos/sistemas-da-informacao.html",
+ "idPage": "curso-sistInf"
},
{
"title": "Sistemas para Internet",
+ "desc": "Explore as tecnologias web mais recentes, aprendendo a desenvolver aplicações web dinâmicas e interativas para atender às demandas do mercado online.",
"text": [
"Tecnologia em Sistemas para Internet prepara você para criar experiências omnichannel e desenvolver plataformas tecnológicas que apoiem o processo de transformação digital do mercado.",
"Este é um curso que possibilita a imersão completa em todo o ecossistema digital: desde a criação, manutenção, segurança e gerenciamento de sites, portais e aplicativos mobile até o desenvolvimento de projetos de Marketing Digital e CyberSecurity.",
@@ -136,7 +167,9 @@
"nav": {
"prev": "./sistemas-da-informacao.html",
"next": ""
- }
+ },
+ "url": "./cursos/sistemas-para-internet.html",
+ "idPage": "curso-sistNet"
}
]
\ No newline at end of file
diff --git a/Components/base/equipe.json b/Components/base/equipe.json
new file mode 100644
index 0000000..44ceb90
--- /dev/null
+++ b/Components/base/equipe.json
@@ -0,0 +1,32 @@
+[
+ {
+ "nome": "André Sant'Ana",
+ "rm": "551575",
+ "avatar": "/src/assets/fotos/foto-andre.jpeg",
+ "github": "https://github.com/andresant-ana"
+ },
+ {
+ "nome": "Gabriel Eringer",
+ "rm": "99632",
+ "avatar": "/src/assets/fotos/foto-gabriel.jpeg",
+ "github": "https://github.com/GEdO23"
+ },
+ {
+ "nome": "Yago Marques",
+ "rm": "551616",
+ "avatar": "/src/assets/fotos/foto-yago.jpeg",
+ "github": "https://github.com/YagoFarah"
+ },
+ {
+ "nome": "Juan Dutra",
+ "rm": "98719",
+ "avatar": "/src/assets/fotos/foto-juan.png",
+ "github": "https://github.com/Juandutr"
+ },
+ {
+ "nome": "Eduardo Tatsuo",
+ "rm": "551428",
+ "avatar": "/src/assets/fotos/foto-tatsuo.png",
+ "github": "https://github.com/tatsuoyohji"
+ }
+]
\ No newline at end of file
diff --git a/Components/base/favoritos.json b/Components/base/favoritos.json
new file mode 100644
index 0000000..9403c8f
--- /dev/null
+++ b/Components/base/favoritos.json
@@ -0,0 +1,77 @@
+[
+ {
+ "integrante": "André Sant'Ana",
+ "sites": [
+ {
+ "href": "https://openai.com/blog/chatgpt",
+ "imgSrc": "/src/assets/logos/logo-chatgpt.png",
+ "imgAlt": "ChatGPT"
+ },
+ {
+ "href": "https://www.bing.com/?cc=br",
+ "imgSrc": "/src/assets/logos/logo-bing.png",
+ "imgAlt": "Microsoft Bing"
+ }
+ ]
+ },
+ {
+ "integrante": "Gabriel Eringer",
+ "sites": [
+ {
+ "href": "https://www.youtube.com",
+ "imgSrc": "/src/assets/logos/logo-youtube.png",
+ "imgAlt": "Youtube"
+ },
+ {
+ "href": "https://mimo.org/web/50/overview",
+ "imgSrc": "/src/assets/logos/logo-mimo.png",
+ "imgAlt": "Mimo"
+ }
+ ]
+ },
+ {
+ "integrante": "Juan Dutra",
+ "sites": [
+ {
+ "href": "https://www.fiap.com.br",
+ "imgSrc": "/src/assets/logos/logo-fiap.png",
+ "imgAlt": "FIAP"
+ },
+ {
+ "href": "https://www.alura.com.br",
+ "imgSrc": "/src/assets/logos/logo-alura.png",
+ "imgAlt": "Alura"
+ }
+ ]
+ },
+ {
+ "integrante": "Yago Farah",
+ "sites": [
+ {
+ "href": "https://www.techtudo.com.br",
+ "imgSrc": "/src/assets/logos/logo-techtudo.png",
+ "imgAlt": "techtudo"
+ },
+ {
+ "href": "https://www.youtube.com",
+ "imgSrc": "/src/assets/logos/logo-youtube.png",
+ "imgAlt": "Youtube"
+ }
+ ]
+ },
+ {
+ "integrante": "Eduardo Tatsuo",
+ "sites": [
+ {
+ "href": "https://jp.mercari.com",
+ "imgSrc": "/src/assets/logos/logo-mercari.png",
+ "imgAlt": "mercari"
+ },
+ {
+ "href": "https://www.balenciaga.com/en-en",
+ "imgSrc": "/src/assets/logos/logo-balenciaga.png",
+ "imgAlt": "Balenciaga"
+ }
+ ]
+ }
+]
\ No newline at end of file
diff --git a/Components/js/Banner/banner.js b/Components/js/Banner/banner.js
new file mode 100644
index 0000000..06d76f4
--- /dev/null
+++ b/Components/js/Banner/banner.js
@@ -0,0 +1,29 @@
+import { AbstractComponent, Anchor, Text } from "../components.js";
+const styles = {
+ "TITLE": "hero-banner__title",
+ "DESC": "hero-banner__description",
+ "BUTTON": "hero-banner__button"
+};
+export class Banner extends AbstractComponent {
+ create(_banner, _title, _desc, _anchor) {
+ try {
+ const title = new Text().create({ content: _title, tag: "h2", className: styles.TITLE });
+ const desc = new Text().create({ content: _desc, tag: "p", className: styles.DESC });
+ const anchor = new Anchor().create(_anchor);
+ if (title)
+ _banner.appendChild(title);
+ if (desc)
+ _banner.appendChild(desc);
+ if (anchor) {
+ anchor.classList.add(styles.BUTTON);
+ _banner.appendChild(anchor);
+ }
+ ;
+ return _banner;
+ }
+ catch (error) {
+ console.error(error);
+ return null;
+ }
+ }
+}
diff --git a/Components/js/Banner/index.js b/Components/js/Banner/index.js
new file mode 100644
index 0000000..aa9532e
--- /dev/null
+++ b/Components/js/Banner/index.js
@@ -0,0 +1,12 @@
+import { Banner } from "./banner.js";
+const info = {
+ "title": "Desbrave o Futuro com Nossos Cursos de Tecnologia",
+ "desc": "Prepare-se para uma carreira de sucesso com os cursos inovadores da nossa faculdade de tecnologia. Explore as últimas tendências, domine habilidades essenciais e conquiste o mercado de trabalho. Seja parte da revolução digital!",
+ "button": {
+ "href": "./src/pages/cursos.html",
+ "content": "Explore Nossos Cursos"
+ }
+};
+const banner = document.getElementById("hero-banner-principal");
+if (banner)
+ new Banner().create(banner, info.title, info.desc, { href: info.button.href, content: info.button.content });
diff --git a/Components/js/Cabecalho/cabecalho.js b/Components/js/Cabecalho/cabecalho.js
new file mode 100644
index 0000000..68e013c
--- /dev/null
+++ b/Components/js/Cabecalho/cabecalho.js
@@ -0,0 +1,43 @@
+import { Container, Anchor, Image, AbstractComponent } from "../components.js";
+const styles = {
+ "LOGO": "cabecalho__logo",
+ "UL": "cabecalho__nav",
+ "A": "link",
+ "CURRENT_PAGE": "link--pagina-atual"
+};
+export class Cabecalho extends AbstractComponent {
+ constructor() {
+ super(...arguments);
+ this.devMode = false;
+ }
+ create(_header, _currentPage, _links) {
+ try {
+ if (_header) {
+ this.devLogComponent("CABEÇALHO", "create", { _header, _currentPage, _links });
+ const logo = new Image().create({ src: "/public/fiap.png", alt: "FIAP", className: styles.LOGO });
+ _links.map(link => this.devLog(link));
+ const nav = new Container().create({ tag: "nav", elements: [
+ new Container().create({ tag: "ul", elements: _links.map((link) => {
+ return new Container().create({ tag: "li", elements: [
+ new Anchor().create({ href: link.href, content: link.content, className: styles.A }, { isSpecial: link.content == _currentPage, specialClass: "link--pagina-atual" })
+ ] });
+ }), className: styles.UL })
+ ] });
+ if (logo) {
+ this.devLog(`LOGO: ${logo.innerHTML}`);
+ _header.appendChild(logo);
+ }
+ if (nav) {
+ this.devLog(`NAV: ${nav.innerHTML}`);
+ _header.appendChild(nav);
+ }
+ this.devLogComponent("CABEÇALHO", "create", { _header });
+ }
+ return _header;
+ }
+ catch (error) {
+ console.error(error);
+ return null;
+ }
+ }
+}
diff --git a/Components/js/Cabecalho/index.js b/Components/js/Cabecalho/index.js
new file mode 100644
index 0000000..044f482
--- /dev/null
+++ b/Components/js/Cabecalho/index.js
@@ -0,0 +1,31 @@
+import { Cabecalho } from "../Cabecalho/cabecalho.js";
+const paginas = [
+ {
+ "url": "/index.html",
+ "nome": "Página Inicial",
+ "cabecalho_id": "cabecalho--principal"
+ },
+ {
+ "url": "/src/pages/cursos.html",
+ "nome": "Cursos",
+ "cabecalho_id": "cabecalho--cursos"
+ },
+ {
+ "url": "/src/pages/favoritos.html",
+ "nome": "Favoritos",
+ "cabecalho_id": "cabecalho--favoritos"
+ },
+ {
+ "url": "/src/pages/equipe.html",
+ "nome": "Equipe",
+ "cabecalho_id": "cabecalho--equipe"
+ }
+];
+const links = paginas.map(pagina => {
+ return { href: pagina.url, content: pagina.nome, target: "_self" };
+});
+for (let i = 0; i < paginas.length; i++) {
+ const header = document.getElementById(paginas[i].cabecalho_id);
+ if (header)
+ new Cabecalho().create(header, paginas[i].nome, links);
+}
diff --git a/Components/js/Card/card.js b/Components/js/Card/card.js
new file mode 100644
index 0000000..4b60ed2
--- /dev/null
+++ b/Components/js/Card/card.js
@@ -0,0 +1,29 @@
+import { Container, Anchor, Image, Text, AbstractComponent } from "../components.js";
+const styles = {
+ "CARD": "card",
+ "IMAGE": "card__image",
+ "TEXT_CONTAINER": "card__text-container",
+ "TITLE": "card__title",
+ "TEXT": "card__text",
+ "BUTTON": "card__button"
+};
+export class Card extends AbstractComponent {
+ create(_title = "default title", _desc = "default description", _button = { href: "#", content: "default button", target: "_self" }, _img) {
+ try {
+ const card = new Container().create({ tag: "div", elements: [
+ new Image().create({ src: _img.src, alt: _img.alt, className: styles.IMAGE, rounded: _img.rounded }),
+ new Container().create({ tag: "div", elements: [
+ new Text().create({ content: _title, tag: "h3", className: styles.TITLE }),
+ new Text().create({ content: _desc, tag: "p", className: styles.TEXT })
+ ], className: styles.TEXT_CONTAINER }),
+ new Anchor().create({ href: _button.href, content: _button.content, className: styles.BUTTON })
+ ], className: styles.CARD });
+ this.devLogComponent("CARD", "create", card);
+ return card;
+ }
+ catch (error) {
+ console.error(error);
+ return null;
+ }
+ }
+}
diff --git a/Components/js/Card/cursos.js b/Components/js/Card/cursos.js
new file mode 100644
index 0000000..f0d52f1
--- /dev/null
+++ b/Components/js/Card/cursos.js
@@ -0,0 +1,16 @@
+import { Card } from "./card.js";
+const cardSectionID = ".card-section--cursos";
+const url = "../../components/base/cursos.json";
+fetch(url, { method: "GET" })
+ .then((_response) => _response.json())
+ .then((_data) => {
+ const cardSection = document.querySelector(cardSectionID);
+ if (cardSection) {
+ _data.map((data) => {
+ const card = new Card().create(data.title, data.desc, { href: data.url, content: "ACESSAR" }, { src: "../assets/logos/logo-fiap.png", alt: "FIAP" });
+ if (card)
+ cardSection.appendChild(card);
+ });
+ }
+})
+ .catch((error) => console.error(error));
diff --git a/Components/js/Card/equipe.js b/Components/js/Card/equipe.js
new file mode 100644
index 0000000..7e75bfb
--- /dev/null
+++ b/Components/js/Card/equipe.js
@@ -0,0 +1,16 @@
+import { Card } from "./card.js";
+const cardSectionID = ".card-section--equipe";
+const url = "../../components/base/equipe.json";
+fetch(url, { method: "GET" })
+ .then((_response) => _response.json())
+ .then((_data) => {
+ const cardSection = document.querySelector(cardSectionID);
+ if (cardSection) {
+ _data.map((data) => {
+ const card = new Card().create(data.nome, `RM ${data.rm}`, { href: data.github, content: "VISITAR GITHUB" }, { src: data.avatar, alt: `Avatar de ${data.nome}`, rounded: "100%" });
+ if (card)
+ cardSection.appendChild(card);
+ });
+ }
+})
+ .catch((error) => console.error(error));
diff --git a/Components/js/Card/favoritos.js b/Components/js/Card/favoritos.js
new file mode 100644
index 0000000..d269f0c
--- /dev/null
+++ b/Components/js/Card/favoritos.js
@@ -0,0 +1,18 @@
+import { Card } from "./card.js";
+const cardSectionID = ".card-section--favorites";
+const url = "../../components/base/favoritos.json";
+fetch(url, { method: "GET" })
+ .then((_response) => _response.json())
+ .then((_data) => {
+ const cardSection = document.querySelector(cardSectionID);
+ if (cardSection) {
+ _data.map((data) => {
+ data.sites.map((site) => {
+ const card = new Card().create(site.imgAlt, data.integrante, { href: site.href, content: "VISITAR PÁGINA" }, { src: site.imgSrc, alt: site.imgAlt });
+ if (card)
+ cardSection.appendChild(card);
+ });
+ });
+ }
+})
+ .catch((error) => console.error(error));
diff --git a/Components/js/Curso/curso.js b/Components/js/Curso/curso.js
new file mode 100644
index 0000000..1094b76
--- /dev/null
+++ b/Components/js/Curso/curso.js
@@ -0,0 +1,32 @@
+import { Container, Anchor, Text, AbstractComponent } from "../components.js";
+export class Curso extends AbstractComponent {
+ constructor() {
+ super(...arguments);
+ this.styles = {
+ "CURSO": "cursos",
+ "TITLE": "cursos__title",
+ "TEXT_CONTAINER": "cursos__text-container",
+ "NAV": "cursos__nav",
+ "LINK": "link"
+ };
+ this.devMode = true;
+ }
+ create(_title = "default title", _text = ["default text"], _nav) {
+ try {
+ const curso = new Container().create({ tag: "div", elements: [
+ new Text().create({ content: _title, tag: "h2", className: this.styles.TITLE }),
+ new Container().create({ tag: "div", elements: _text.map(text => new Text().create({ content: text, tag: "p" })), className: this.styles.TEXT_CONTAINER }),
+ new Container().create({ tag: "nav", elements: [
+ _nav.prev ? new Anchor().create({ href: _nav.prev, content: "Curso Anterior", className: this.styles.LINK }) : null,
+ _nav.next ? new Anchor().create({ href: _nav.next, content: "Próximo Curso", className: this.styles.LINK }) : null
+ ], className: this.styles.NAV })
+ ], className: this.styles.CURSO });
+ this.devLogComponent("CURSO", "create", curso === null || curso === void 0 ? void 0 : curso.innerHTML);
+ return curso;
+ }
+ catch (error) {
+ console.error(error);
+ return null;
+ }
+ }
+}
diff --git a/Components/js/Curso/index.js b/Components/js/Curso/index.js
new file mode 100644
index 0000000..b2cb4a4
--- /dev/null
+++ b/Components/js/Curso/index.js
@@ -0,0 +1,15 @@
+import { Curso } from "./curso.js";
+const url = "../../../components/base/cursos.json";
+fetch(url, { method: "GET" })
+ .then((_response) => _response.json())
+ .then((_data) => {
+ _data.map((curso) => {
+ const section = document.getElementById(curso.idPage);
+ if (section) {
+ const element = new Curso().create(curso.title, curso.text, curso.nav);
+ if (element)
+ section.appendChild(element);
+ }
+ });
+})
+ .catch((error) => console.error(error));
diff --git a/Components/js/components.js b/Components/js/components.js
new file mode 100644
index 0000000..0f5baa3
--- /dev/null
+++ b/Components/js/components.js
@@ -0,0 +1,119 @@
+export class AbstractComponent {
+ constructor() {
+ this.devMode = false;
+ }
+ addSelector(_component, _className, _id) {
+ if (_className)
+ _component.classList.add(_className);
+ if (_id)
+ _component.id = _id;
+ }
+ devLog(element) {
+ if (this.devMode)
+ console.log(element);
+ }
+ devLogComponent(_name, _function, _params) {
+ if (this.devMode) {
+ this.devLog(`${_name} ${_function} | params`);
+ for (const item in _params) {
+ this.devLog(`${item}: ${_params[item]}`);
+ }
+ }
+ }
+}
+export class Container extends AbstractComponent {
+ constructor() {
+ super(...arguments);
+ this.devMode = false;
+ }
+ create(_container = { tag: "div", elements: [] }) {
+ try {
+ const container = document.createElement(_container.tag);
+ this.addSelector(container, _container.className, _container.id);
+ if (_container.elements) {
+ _container.elements.map((element, i) => {
+ if (element) {
+ container.appendChild(element);
+ this.devLogComponent("CONTAINER", "elements", [element.innerHTML]);
+ }
+ });
+ }
+ ;
+ this.devLogComponent("CONTAINER", "create", _container);
+ return container;
+ }
+ catch (e) {
+ console.error(e);
+ return null;
+ }
+ }
+}
+export class Anchor extends AbstractComponent {
+ constructor() {
+ super(...arguments);
+ this.devMode = false;
+ }
+ create(_anchor = { href: "#", content: "default anchor", target: "_self" }, _special) {
+ try {
+ const anchor = document.createElement("a");
+ anchor.href = _anchor.href;
+ anchor.innerHTML = _anchor.content;
+ _anchor.target ? anchor.target = _anchor.target : "_self";
+ this.addSelector(anchor, _anchor.className, _anchor.id);
+ if (_special) {
+ this.devLog(`ìsSpecial: ${_special.isSpecial}`);
+ if (_special.isSpecial)
+ anchor.classList.add(_special.specialClass);
+ this.devLog(`anchor with special class: ${anchor.innerHTML}`);
+ }
+ this.devLogComponent("ANCHOR", "create", _anchor);
+ return anchor;
+ }
+ catch (error) {
+ console.error(error);
+ return null;
+ }
+ }
+}
+export class Image extends AbstractComponent {
+ constructor() {
+ super(...arguments);
+ this.devMode = false;
+ }
+ create(_image = { src: "", alt: "", rounded: "0" }) {
+ try {
+ const image = document.createElement('img');
+ image.src = _image.src;
+ if (_image.alt)
+ image.alt = _image.alt;
+ if (_image.rounded)
+ image.style.borderRadius = _image.rounded;
+ this.addSelector(image, _image.className, _image.id);
+ this.devLogComponent("IMAGE", "create", _image);
+ return image;
+ }
+ catch (error) {
+ console.error(error);
+ return null;
+ }
+ }
+}
+export class Text extends AbstractComponent {
+ constructor() {
+ super(...arguments);
+ this.devMode = false;
+ }
+ create(_text = { content: "default text", tag: "p" }) {
+ try {
+ const text = document.createElement(_text.tag);
+ text.innerHTML = _text.content;
+ this.addSelector(text, _text.className, _text.id);
+ this.devLogComponent("TEXT", "create", _text);
+ return text;
+ }
+ catch (error) {
+ console.error(error);
+ return null;
+ }
+ }
+}
diff --git a/Components/ts/Banner/banner.ts b/Components/ts/Banner/banner.ts
new file mode 100644
index 0000000..21754ec
--- /dev/null
+++ b/Components/ts/Banner/banner.ts
@@ -0,0 +1,28 @@
+import { AbstractComponent, Anchor, IAnchor, Text } from "../components.js";
+
+const styles = {
+ "TITLE": "hero-banner__title",
+ "DESC": "hero-banner__description",
+ "BUTTON": "hero-banner__button"
+}
+
+export class Banner extends AbstractComponent {
+ create(_banner: HTMLElement, _title: string, _desc: string, _anchor: IAnchor): HTMLElement | null {
+ try {
+ const title = new Text().create({ content: _title, tag: "h2", className: styles.TITLE });
+ const desc = new Text().create({ content: _desc, tag: "p", className: styles.DESC });
+ const anchor = new Anchor().create(_anchor);
+ if (title) _banner.appendChild(title);
+ if (desc) _banner.appendChild(desc);
+ if (anchor) {
+ anchor.classList.add(styles.BUTTON);
+ _banner.appendChild(anchor)
+ };
+ return _banner;
+
+ } catch (error) {
+ console.error(error);
+ return null;
+ }
+ }
+}
diff --git a/Components/ts/Banner/index.ts b/Components/ts/Banner/index.ts
new file mode 100644
index 0000000..4bc8845
--- /dev/null
+++ b/Components/ts/Banner/index.ts
@@ -0,0 +1,18 @@
+import { Banner } from "./banner.js";
+
+const info = {
+ "title": "Desbrave o Futuro com Nossos Cursos de Tecnologia",
+ "desc": "Prepare-se para uma carreira de sucesso com os cursos inovadores da nossa faculdade de tecnologia. Explore as últimas tendências, domine habilidades essenciais e conquiste o mercado de trabalho. Seja parte da revolução digital!",
+ "button": {
+ "href": "./src/pages/cursos.html",
+ "content": "Explore Nossos Cursos"
+ }
+}
+
+const banner = document.getElementById("hero-banner-principal");
+
+if (banner) new Banner().create(
+ banner, info.title, info.desc,
+ { href: info.button.href, content: info.button.content }
+);
+
diff --git a/Components/ts/Cabecalho/cabecalho.ts b/Components/ts/Cabecalho/cabecalho.ts
new file mode 100644
index 0000000..8608cc0
--- /dev/null
+++ b/Components/ts/Cabecalho/cabecalho.ts
@@ -0,0 +1,50 @@
+import { Container, Anchor, Image, IAnchor, AbstractComponent } from "../components.js";
+
+const styles = {
+ "LOGO": "cabecalho__logo",
+ "UL": "cabecalho__nav",
+ "A": "link",
+ "CURRENT_PAGE": "link--pagina-atual"
+};
+
+export class Cabecalho extends AbstractComponent {
+
+ protected devMode: boolean = false;
+
+ create(_header: HTMLElement, _currentPage: string, _links: IAnchor[]): HTMLElement | null {
+ try {
+ if (_header) {
+ this.devLogComponent("CABEÇALHO", "create", {_header, _currentPage, _links});
+
+ const logo = new Image().create({ src: "/public/fiap.png", alt: "FIAP", className: styles.LOGO });
+
+ _links.map(link => this.devLog(link))
+ const nav = new Container().create({ tag: "nav", elements: [
+ new Container().create({ tag: "ul", elements: _links.map((link) => {
+ return new Container().create({ tag: "li", elements: [
+ new Anchor().create({ href: link.href, content: link.content, className: styles.A}, { isSpecial: link.content == _currentPage, specialClass: "link--pagina-atual"})
+ ]})
+ }), className: styles.UL})
+ ]});
+
+ if (logo) {
+ this.devLog(`LOGO: ${logo.innerHTML}`)
+ _header.appendChild(logo);
+ }
+
+ if (nav) {
+ this.devLog(`NAV: ${nav.innerHTML}`)
+ _header.appendChild(nav);
+ }
+
+ this.devLogComponent( "CABEÇALHO", "create", {_header});
+ }
+
+ return _header;
+
+ } catch (error) {
+ console.error(error);
+ return null;
+ }
+ }
+}
diff --git a/Components/ts/Cabecalho/index.ts b/Components/ts/Cabecalho/index.ts
new file mode 100644
index 0000000..5811a0f
--- /dev/null
+++ b/Components/ts/Cabecalho/index.ts
@@ -0,0 +1,33 @@
+import { Cabecalho } from "../Cabecalho/cabecalho.js";
+
+const paginas = [
+ {
+ "url": "/index.html",
+ "nome": "Página Inicial",
+ "cabecalho_id": "cabecalho--principal"
+ },
+ {
+ "url": "/src/pages/cursos.html",
+ "nome": "Cursos",
+ "cabecalho_id": "cabecalho--cursos"
+ },
+ {
+ "url": "/src/pages/favoritos.html",
+ "nome": "Favoritos",
+ "cabecalho_id": "cabecalho--favoritos"
+ },
+ {
+ "url": "/src/pages/equipe.html",
+ "nome": "Equipe",
+ "cabecalho_id": "cabecalho--equipe"
+ }
+]
+
+const links = paginas.map(pagina => {
+ return { href: pagina.url, content: pagina.nome, target: "_self" }
+});
+
+for (let i = 0; i < paginas.length; i++) {
+ const header = document.getElementById(paginas[i].cabecalho_id);
+ if (header) new Cabecalho().create(header, paginas[i].nome, links);
+}
diff --git a/Components/ts/Card/card.ts b/Components/ts/Card/card.ts
new file mode 100644
index 0000000..50253aa
--- /dev/null
+++ b/Components/ts/Card/card.ts
@@ -0,0 +1,36 @@
+import { Container, Anchor, Image, Text, AbstractComponent, IAnchor, IImage } from "../components.js";
+
+const styles = {
+ "CARD": "card",
+ "IMAGE": "card__image",
+ "TEXT_CONTAINER": "card__text-container",
+ "TITLE": "card__title",
+ "TEXT": "card__text",
+ "BUTTON": "card__button"
+}
+
+interface ICard {
+ create(_title: string, _desc: string, _button: IAnchor, _img: IImage): HTMLElement | null;
+}
+
+export class Card extends AbstractComponent implements ICard {
+ create(_title: string="default title", _desc: string="default description", _button: IAnchor={ href: "#", content: "default button", target: "_self" }, _img: IImage): HTMLElement | null {
+ try {
+ const card = new Container().create({ tag: "div", elements: [
+ new Image().create({ src: _img.src, alt: _img.alt, className: styles.IMAGE, rounded: _img.rounded}),
+ new Container().create({ tag: "div", elements: [
+ new Text().create({ content: _title, tag: "h3", className: styles.TITLE }),
+ new Text().create({ content: _desc, tag: "p", className: styles.TEXT })
+ ], className: styles.TEXT_CONTAINER }),
+ new Anchor().create({ href: _button.href, content: _button.content, className: styles.BUTTON })
+ ], className: styles.CARD })
+
+ this.devLogComponent("CARD", "create", card);
+ return card;
+
+ } catch (error) {
+ console.error(error);
+ return null;
+ }
+ }
+}
diff --git a/Components/ts/Card/cursos.ts b/Components/ts/Card/cursos.ts
new file mode 100644
index 0000000..f52ed4e
--- /dev/null
+++ b/Components/ts/Card/cursos.ts
@@ -0,0 +1,23 @@
+import { Card } from "./card.js";
+
+const cardSectionID = ".card-section--cursos";
+const url = "../../components/base/cursos.json";
+
+fetch(url, {method: "GET"})
+ .then((_response) => _response.json())
+ .then((_data) => {
+ const cardSection = document.querySelector( cardSectionID );
+ if (cardSection) {
+ _data.map((data: any) => {
+
+ const card = new Card().create(
+ data.title, data.desc,
+ { href: data.url, content: "ACESSAR" },
+ { src: "../assets/logos/logo-fiap.png", alt: "FIAP" }
+ );
+
+ if (card) cardSection.appendChild(card);
+ })
+ }
+ })
+ .catch((error) => console.error(error));
diff --git a/Components/ts/Card/equipe.ts b/Components/ts/Card/equipe.ts
new file mode 100644
index 0000000..3e26435
--- /dev/null
+++ b/Components/ts/Card/equipe.ts
@@ -0,0 +1,23 @@
+import { Card } from "./card.js";
+
+const cardSectionID = ".card-section--equipe";
+const url = "../../components/base/equipe.json";
+
+fetch(url, {method: "GET"})
+ .then((_response) => _response.json())
+ .then((_data) => {
+ const cardSection = document.querySelector( cardSectionID );
+ if (cardSection) {
+ _data.map((data: any) => {
+
+ const card = new Card().create(
+ data.nome, `RM ${data.rm}`,
+ { href: data.github, content: "VISITAR GITHUB" },
+ { src: data.avatar, alt: `Avatar de ${data.nome}`, rounded: "100%" }
+ );
+
+ if (card) cardSection.appendChild(card);
+ })
+ }
+ })
+ .catch((error) => console.error(error));
diff --git a/Components/ts/Card/favoritos.ts b/Components/ts/Card/favoritos.ts
new file mode 100644
index 0000000..bfb1dd7
--- /dev/null
+++ b/Components/ts/Card/favoritos.ts
@@ -0,0 +1,26 @@
+import { Card } from "./card.js";
+
+const cardSectionID = ".card-section--favorites";
+const url = "../../components/base/favoritos.json";
+
+fetch(url, {method: "GET"})
+ .then((_response) => _response.json())
+ .then((_data) => {
+ const cardSection = document.querySelector( cardSectionID );
+ if (cardSection) {
+ _data.map((data: any) => {
+
+ data.sites.map((site: any) => {
+ const card = new Card().create(
+ site.imgAlt, data.integrante,
+ { href: site.href, content: "VISITAR PÁGINA" },
+ { src: site.imgSrc, alt: site.imgAlt }
+ );
+
+ if (card) cardSection.appendChild(card);
+ })
+ })
+ }
+ })
+ .catch((error) => console.error(error));
+
diff --git a/Components/ts/Curso/curso.ts b/Components/ts/Curso/curso.ts
new file mode 100644
index 0000000..39ee86b
--- /dev/null
+++ b/Components/ts/Curso/curso.ts
@@ -0,0 +1,38 @@
+import { Container, Anchor, Text, AbstractComponent } from "../components.js";
+
+export class Curso extends AbstractComponent {
+
+ private styles = {
+ "CURSO": "cursos",
+ "TITLE": "cursos__title",
+ "TEXT_CONTAINER": "cursos__text-container",
+ "NAV": "cursos__nav",
+ "LINK": "link"
+ };
+
+ protected devMode: boolean = true;
+
+ create(_title: string="default title", _text: string[]=["default text"], _nav: {"prev": string, "next": string}): HTMLElement | null {
+ try {
+ const curso = new Container().create({ tag: "div", elements: [
+ new Text().create({ content: _title, tag: "h2", className: this.styles.TITLE }),
+ new Container().create({ tag: "div", elements: _text.map(text =>
+ new Text().create({ content: text, tag: "p" })
+ ), className: this.styles.TEXT_CONTAINER }),
+ new Container().create({ tag: "nav", elements: [
+ _nav.prev ? new Anchor().create({ href: _nav.prev, content: "Curso Anterior", className: this.styles.LINK }) : null,
+ _nav.next ? new Anchor().create({ href: _nav.next, content: "Próximo Curso", className: this.styles.LINK }) : null
+ ], className: this.styles.NAV })
+ ], className: this.styles.CURSO })
+
+ this.devLogComponent("CURSO", "create", curso?.innerHTML )
+
+ return curso;
+
+ } catch (error) {
+ console.error(error);
+ return null;
+ }
+ }
+}
+
diff --git a/Components/ts/Curso/index.ts b/Components/ts/Curso/index.ts
new file mode 100644
index 0000000..1451d45
--- /dev/null
+++ b/Components/ts/Curso/index.ts
@@ -0,0 +1,17 @@
+import { Curso } from "./curso.js";
+
+const url = "../../../components/base/cursos.json";
+
+fetch(url, {method: "GET"})
+ .then((_response) => _response.json())
+ .then((_data) => {
+ _data.map((curso: any) => {
+ const section = document.getElementById(curso.idPage);
+
+ if (section) {
+ const element = new Curso().create(curso.title, curso.text, curso.nav);
+ if (element) section.appendChild(element);
+ }
+ })
+ })
+ .catch((error) => console.error(error));
diff --git a/Components/ts/components.ts b/Components/ts/components.ts
new file mode 100644
index 0000000..3d3fe5c
--- /dev/null
+++ b/Components/ts/components.ts
@@ -0,0 +1,156 @@
+
+export interface ISelector {
+ className?: string;
+ id?: string;
+}
+
+export interface ISpecialClass {
+ isSpecial: boolean;
+ specialClass: string;
+}
+
+export interface IContainer extends ISelector {
+ tag: string;
+ elements?: (HTMLElement | null)[];
+}
+
+export interface IAnchor extends ISelector {
+ href: string;
+ content: string;
+ target?: string;
+}
+
+export interface IImage extends ISelector {
+ src: string;
+ alt?: string;
+ rounded?: string;
+}
+
+export interface IText extends ISelector {
+ content: string;
+ tag: string;
+}
+
+export abstract class AbstractComponent {
+
+ protected addSelector(_component: HTMLElement, _className?: string, _id?: string) {
+ if (_className) _component.classList.add(_className);
+ if (_id) _component.id = _id;
+ }
+
+ protected devMode = false;
+
+ protected devLog(element: any) {
+ if (this.devMode) console.log(element);
+ }
+
+ protected devLogComponent(_name: string, _function: string, _params: any) {
+ if (this.devMode) {
+ this.devLog(`${_name} ${_function} | params`)
+ for (const item in _params) {
+ this.devLog(`${item}: ${_params[item]}`);
+ }
+ }
+ }
+}
+
+export class Container extends AbstractComponent {
+
+ protected devMode: boolean = false;
+
+ create(_container: IContainer={tag: "div", elements: []}): HTMLElement | null {
+ try {
+ const container = document.createElement(_container.tag);
+
+ this.addSelector(container, _container.className, _container.id );
+
+ if (_container.elements) {
+ _container.elements.map((element, i) => {
+ if(element) {
+ container.appendChild(element);
+ this.devLogComponent( "CONTAINER", "elements", [element.innerHTML]);
+ }
+ })
+ };
+
+ this.devLogComponent( "CONTAINER", "create", _container);
+ return container;
+
+ } catch (e) {
+ console.error(e);
+ return null;
+ }
+ }
+
+}
+
+export class Anchor extends AbstractComponent {
+
+ protected devMode: boolean = false;
+
+ create(_anchor: IAnchor={ href: "#", content: "default anchor", target: "_self" }, _special?: ISpecialClass): HTMLElement | null {
+ try {
+ const anchor = document.createElement("a");
+ anchor.href = _anchor.href;
+ anchor.innerHTML = _anchor.content;
+ _anchor.target ? anchor.target = _anchor.target : "_self";
+ this.addSelector(anchor, _anchor.className, _anchor.id );
+ if (_special) {
+ this.devLog(`ìsSpecial: ${_special.isSpecial}`)
+ if (_special.isSpecial) anchor.classList.add(_special.specialClass);
+ this.devLog(`anchor with special class: ${anchor.innerHTML}`)
+ }
+
+ this.devLogComponent("ANCHOR", "create", _anchor);
+ return anchor;
+
+ } catch (error) {
+ console.error(error);
+ return null;
+ }
+ }
+}
+
+export class Image extends AbstractComponent {
+
+ protected devMode: boolean = false;
+
+ create(_image: IImage={src: "", alt: "", rounded: "0"}): HTMLElement | null {
+ try {
+ const image = document.createElement('img');
+ image.src = _image.src;
+ if (_image.alt) image.alt = _image.alt;
+ if (_image.rounded) image.style.borderRadius = _image.rounded;
+
+ this.addSelector(image, _image.className, _image.id );
+ this.devLogComponent("IMAGE", "create", _image);
+
+ return image;
+
+ } catch (error) {
+ console.error(error);
+ return null;
+ }
+ }
+}
+
+export class Text extends AbstractComponent {
+
+ protected devMode: boolean = false;
+
+ create(_text: IText={ content: "default text", tag: "p" }): HTMLElement | null {
+ try {
+ const text = document.createElement(_text.tag);
+ text.innerHTML = _text.content;
+
+ this.addSelector(text, _text.className, _text.id );
+ this.devLogComponent("TEXT", "create", _text);
+
+ return text;
+
+ } catch (error) {
+ console.error(error);
+ return null;
+ }
+ }
+}
diff --git a/Imgs/alura.png b/Imgs/alura.png
deleted file mode 100644
index 00aa809..0000000
Binary files a/Imgs/alura.png and /dev/null differ
diff --git a/Imgs/balenciaga.png b/Imgs/balenciaga.png
deleted file mode 100644
index c256899..0000000
Binary files a/Imgs/balenciaga.png and /dev/null differ
diff --git a/Imgs/bing.jpg b/Imgs/bing.jpg
deleted file mode 100644
index 5cbaf99..0000000
Binary files a/Imgs/bing.jpg and /dev/null differ
diff --git a/Imgs/chatgpt.jpg b/Imgs/chatgpt.jpg
deleted file mode 100644
index 296d7a6..0000000
Binary files a/Imgs/chatgpt.jpg and /dev/null differ
diff --git a/Imgs/mercari.jpg b/Imgs/mercari.jpg
deleted file mode 100644
index 5e059a0..0000000
Binary files a/Imgs/mercari.jpg and /dev/null differ
diff --git a/Imgs/mimo.png b/Imgs/mimo.png
deleted file mode 100644
index bbc243b..0000000
Binary files a/Imgs/mimo.png and /dev/null differ
diff --git a/Imgs/techtudo.png b/Imgs/techtudo.png
deleted file mode 100644
index c828e12..0000000
Binary files a/Imgs/techtudo.png and /dev/null differ
diff --git a/Imgs/youtube.png b/Imgs/youtube.png
deleted file mode 100644
index b33882f..0000000
Binary files a/Imgs/youtube.png and /dev/null differ
diff --git a/cursos.html b/cursos.html
deleted file mode 100644
index ce0334a..0000000
--- a/cursos.html
+++ /dev/null
@@ -1,48 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Cursos - FIAP
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/cursos/adm.html b/cursos/adm.html
deleted file mode 100644
index 876bdb0..0000000
--- a/cursos/adm.html
+++ /dev/null
@@ -1,39 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
- ADM - FIAP Cursos
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/cursos/ads.html b/cursos/ads.html
deleted file mode 100644
index 243c656..0000000
--- a/cursos/ads.html
+++ /dev/null
@@ -1,39 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
- ADS - FIAP Cursos
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/cursos/banco-de-dados.html b/cursos/banco-de-dados.html
deleted file mode 100644
index b69aa48..0000000
--- a/cursos/banco-de-dados.html
+++ /dev/null
@@ -1,39 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
- BANCO DE DADOS - FIAP Cursos
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/cursos/engenharia-da-computacao.html b/cursos/engenharia-da-computacao.html
deleted file mode 100644
index fbd40b4..0000000
--- a/cursos/engenharia-da-computacao.html
+++ /dev/null
@@ -1,39 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
- ENGENHARIA DA COMPUTAÇÃO - FIAP Cursos
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/cursos/engenharia-da-mecatronica.html b/cursos/engenharia-da-mecatronica.html
deleted file mode 100644
index 0e1b30d..0000000
--- a/cursos/engenharia-da-mecatronica.html
+++ /dev/null
@@ -1,39 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
- ENGENHARIA DA MECATRÔNICA - FIAP Cursos
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/cursos/engenharia-da-producao.html b/cursos/engenharia-da-producao.html
deleted file mode 100644
index d8a31d9..0000000
--- a/cursos/engenharia-da-producao.html
+++ /dev/null
@@ -1,39 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
- ENGENHARIA DA PRODUÇÃO - FIAP Cursos
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/cursos/gestao-de-tecnologia-da-informacao.html b/cursos/gestao-de-tecnologia-da-informacao.html
deleted file mode 100644
index 0fadebe..0000000
--- a/cursos/gestao-de-tecnologia-da-informacao.html
+++ /dev/null
@@ -1,39 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
- GESTÃO DE TECNOLOGIA DA INFORMAÇÃO - FIAP Cursos
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/cursos/jogos-digitais.html b/cursos/jogos-digitais.html
deleted file mode 100644
index 3634d79..0000000
--- a/cursos/jogos-digitais.html
+++ /dev/null
@@ -1,39 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
- JOGOS DIGITAIS - FIAP Cursos
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/cursos/rede-de-computadores.html b/cursos/rede-de-computadores.html
deleted file mode 100644
index 7904575..0000000
--- a/cursos/rede-de-computadores.html
+++ /dev/null
@@ -1,39 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
- REDE DE COMPUTADORES - FIAP Cursos
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/cursos/sistemas-da-informacao.html b/cursos/sistemas-da-informacao.html
deleted file mode 100644
index 3c4fe42..0000000
--- a/cursos/sistemas-da-informacao.html
+++ /dev/null
@@ -1,39 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
- SISTEMAS DA INFORMAÇÃO - FIAP Cursos
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/cursos/sistemas-para-internet.html b/cursos/sistemas-para-internet.html
deleted file mode 100644
index 24adf82..0000000
--- a/cursos/sistemas-para-internet.html
+++ /dev/null
@@ -1,39 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
- SISTEMAS PARA INTERNET - FIAP Cursos
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/fav.html b/fav.html
deleted file mode 100644
index b71b26e..0000000
--- a/fav.html
+++ /dev/null
@@ -1,72 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Favoritos - FIAP
-
-
-
-
-
-
-
-
-
-
-
diff --git a/index.html b/index.html
index 533005c..2d9cb98 100644
--- a/index.html
+++ b/index.html
@@ -6,45 +6,20 @@
-
-
-
-
-
+
+
+
+
FIAP
-
-
-
-
+
-
-
-
Desbrave o Futuro com Nossos Cursos de Tecnologia
-
Prepare-se para uma carreira de sucesso com os cursos inovadores da nossa faculdade de tecnologia. Explore as últimas tendências, domine habilidades essenciais e conquiste o mercado de trabalho. Seja parte da revolução digital!
-
- 
-
- 
-
-