MAIA Landing Page Redesign

.eslintrc.cjs

@@ -0,0 +1,18 @@
+module.exports = {
+  root: true,
+  env: { browser: true, es2020: true },
+  extends: [
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:react-hooks/recommended',
+  ],
+  ignorePatterns: ['dist', '.eslintrc.cjs'],
+  parser: '@typescript-eslint/parser',
+  plugins: ['react-refresh'],
+  rules: {
+    'react-refresh/only-export-components': [
+      'warn',
+      { allowConstantExport: true },
+    ],
+  },
+}

.gitignore

@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

README.md

@@ -1 +1,25 @@
-# **STATIC SITE TO SELETIVE PROCESS MAIA**
+# MAIA Redesign
+Landing page criada para um processo seletivo do [MAIA FACENS](https://lince.facens.br/maia-mobilidade-aplicada-e-inteligencia-artificial/).
+
+O MAIA é um subnúcleo do LINCE e tem como objetivo oferecer uma oportunidade ímpar aos alunos de terem contato na prática com tecnologias disruptivas, tais como veículos elétricos, veículos autônomos, algoritmos preditivos, dentre outras Aplicações em Mobilidade e Inteligência Artificial (IA).
+
+Para o desenvolvimento utilizei as seguintes tecnologias: ReactJS, Typescript e CSS.
+
+DEPLOY: [CLIQUE PARA VER O PROJETO](https://maia-redesign.vercel.app/)
+
+OBS: Também escrevi um artigo sobre IA para esse processo seletivo [(Clique aqui para ler)](./docs/Article.md)
+
+![Thumbnail MAIA](./docs/thumbnail.png)
+
+## Manual de uso
+### Inicialiando o site - [http://localhost:5173/](http://localhost:5173/)
+```sh
+npm install
+```
+```sh
+npm run dev
+```
+
+## Design - [Abrir no Figma](https://www.figma.com/community/file/1282372531767949969)
+
+![Landing Page MAIA](./docs/landing-page.png)

docs/Article.md

@@ -0,0 +1,20 @@
+# A Profecia de Alan Turing
+
+Alan Turing, que é considerado o pai da computação, em 1950 publicou um artigo intitulado "Computing Machinery And Intelligence". Neste trabalho, Turing mergulhou profundamente na questão fundamental de se as máquinas poderiam pensar, e descreveu uma teoria visionária.
+
+O artigo tem como ponto central “O Jogo da Imitação”, também conhecido como “Teste de Turing”, no experimento um interrogador humano interage por meio de mensagens escritas com um participante humano e uma máquina, sem poder ver nenhum deles. O objetivo do interrogador é determinar qual é o humano e qual é a máquina baseando-se apenas nas respostas recebidas, se a máquina conseguir enganar o interrogador, fazendo-o acreditar que é um ser humano, ela passa no teste e demonstra um nível de “inteligência” capaz imitar o comportamento humano. 
+
+Na seção "Learning Machines", Turing sugeriu que o processo pelo qual o cérebro cria novas ideias poderia ser comparado a uma "casca de cebola". Ele argumentou que, ao ser apresentado a uma ideia, o cérebro gera menos do que uma ideia em retorno. Porém, como possuimos subcamadas de informações previamente inseridas, podemos conectar essas informações antigas e gerar algo "novo". A partir dessa teoria, Turing propôs uma simulação de uma "mente infantil", que seria submetida à uma educação apropriada, para criar essas subcamadas de informação e, finalmente, desenvolver um cérebro adulto.
+
+Turing propôs que a programação da educação das máquinas fosse baseada em punições e recompensas. Quando um sinal de punição é emitido, a probabilidade de repetir uma ação diminui, enquanto um sinal de recompensa aumenta a probabilidade de repetição da ação. É um processo análogo à evolução.
+
+Essa abordagem visionária inspirou inúmeros debates intelectuais e tentativas de criar máquinas capazes de passar no Teste de Turing. 
+
+Agora, avançando no tempo, chegamos à era do Machine Learning, uma área que desenvolve algoritmos para permitir que as máquinas aprendam com dados, identifiquem padrões e melhorem seu desempenho em tarefas específicas, tudo isso sem a necessidade de programação explícita para cada situação. As abordagens do Machine Learning incluem aprendizado supervisionado, aprendizado não supervisionado e aprendizado por reforço.
+
+É notável a semelhança entre as técnicas usadas nos dias atuais no campo do Machine Learning e as ideias pioneiras de Turing. Isso evidencia a importância duradoura de seu artigo na história da Inteligência Artificial.
+
+![Alan Turing](./alan-turing.jpg)
+
+## Bibliografia
+[A. M. TURING - COMPUTING MACHINERY AND INTELLIGENCE](https://academic.oup.com/mind/article/LIX/236/433/986238)

index.html

@@ -1,109 +1,13 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <link rel="icon" type="image/x-icon" href="static/img/favicon.ico">
-    <link rel="stylesheet" href="static/css/style.css">
-    <title>LINCE - MAIA</title>
-</head>
-<body>
-    <main class="main-container">
-        <header>
-            <img class="header-img" src="./static/img/11202-equipe_maia.png" alt="LOGO MAIA"/>
-            <h1>MAIA - MOBILITY APPLIED AND ARTIFICIAL INTELLIGENCE</h1>
-        </header>
-        <article>
-            <section class="center-text">
-                <div>
-                    <h1>THE FUTURE IS WAITING FOR YOU!</h1>
-                </div>
-            </section>
-            <br>
-            <section>
-                    <div class="col-1">
-                        <h1>MAIA</h1>
-                        <p>
-                            The MAIA team, which stands for Mobility Applied in Artificial Intelligence, has as its primary
-                            mission to provide a valuable opportunity for students who want to improve their skills and knowledge
-                            in artificial intelligence and apply them to practical projects.
-                        </p>
-                        <p>
-                            Our team is dedicated to creating a learning and collaborative environment where students
-                            interested in robotics and AI can not only expand their theoretical knowledge, but also put
-                            it into practice by carrying out concrete projects. We believe that practical application 
-                            plays a key role in developing solid AI and engineering skills.
-                        </p>
-                        <p>
-                            We offer challenges where participants can get involved in projects that address real-world
-                            challenges, allowing them to apply AI algorithms, data analysis and machine learning techniques 
-                            to everyday situations. This not only enriches the learning experience, but also prepares our 
-                            members to face the challenges of industry and AI research with confidence.
-                        </p>
-                    </div>
-                    <div class="col-2">
-                        <h1>CATEGORIES</h1>
-                        <ul>
-                            <li>
-                                <h4>Donkey Car:</h4>
-                                <ul>
-                                    <li>
-                                        A small-scale autonomous vehicle that encompasses the fields of software engineering,
-                                        electronics, and mechanics.
-                                    </li>
-                                </ul>
-                            </li>
-                            <br>
-                            <li>
-                                <h4>Eletric Scooter:</h4>
-                                <ul>
-                                    <li>
-                                        Primary goal is to develop an intelligent mode of transportation tailored for college
-                                        students, encompassing the fields of safety, software engineering, electronics, and mechanics.
-                                    </li>
-                                </ul>
-                            </li>
-                            <br>
-                            <li>
-                                <h4>InMoov:</h4>
-                                <ul>
-                                    <li>
-                                        The aim of this category is to create an AI-powered humanoid, covering the fields of 
-                                        software engineering, electronics, and biomechanics.
-                                    </li>
-                                </ul>
-                            </li>
-                            <br>
-                            <li>
-                                <h4>Management:</h4> 
-                                <ul>
-                                    <li>
-                                        It oversees projects, people, and financial management
-                                    </li>
-                                </ul>
-                            </li>
-                            <br>
-                            <li>
-                                <h4>Marketing:</h4>
-                                <ul>
-                                    <li>
-                                        They handle social media, create various content (such as texts, presentations, 
-                                        image and video editing, etc.)
-                                    </li>
-                                </ul>
-
-                            </li>
-                        </ul>
-                    </div>
-            </section>
-            <section class="center-text">
-                <button class="section_btn">
-                    <a class="section_btn_text" href="./article.html"><b>Seletive Process</b></a>
-                </button>
-            </section>
-        </article>
-    </main>
-    <script src="static/js/sticky-script.js"></script>
-</body>
-</html>
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>MAIA | Selective Process</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>