{"id":21437836,"url":"https://github.com/elizabetefabri/spring-reactjs","last_synced_at":"2026-04-12T20:39:34.990Z","repository":{"id":187301970,"uuid":"532976450","full_name":"elizabetefabri/spring-reactjs","owner":"elizabetefabri","description":"🔸 Semana Spring React","archived":false,"fork":false,"pushed_at":"2022-09-11T22:42:57.000Z","size":222,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-01-23T09:44:08.120Z","etag":null,"topics":["heroku","insomnia","java","netlify","reactjs","reactjs-components","spring-boot","typescript"],"latest_commit_sha":null,"homepage":"https://dsmeta-elizabetefabri.netlify.app/","language":"Java","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/elizabetefabri.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2022-09-05T16:22:48.000Z","updated_at":"2022-09-11T23:12:19.000Z","dependencies_parsed_at":"2023-08-09T20:25:20.812Z","dependency_job_id":null,"html_url":"https://github.com/elizabetefabri/spring-reactjs","commit_stats":null,"previous_names":["elizabetefabri/spring-reactjs"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/elizabetefabri%2Fspring-reactjs","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/elizabetefabri%2Fspring-reactjs/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/elizabetefabri%2Fspring-reactjs/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/elizabetefabri%2Fspring-reactjs/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/elizabetefabri","download_url":"https://codeload.github.com/elizabetefabri/spring-reactjs/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243950794,"owners_count":20373664,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["heroku","insomnia","java","netlify","reactjs","reactjs-components","spring-boot","typescript"],"created_at":"2024-11-23T00:29:43.442Z","updated_at":"2026-04-12T20:39:29.960Z","avatar_url":"https://github.com/elizabetefabri.png","language":"Java","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cdiv align=\"center\"\u003e\n\n# Semana Spring ReactJS - DevSuperior\n\n## Clique na imagem para ver o site\n\n\u003ca href=\"https://dsmeta-elizabetefabri.netlify.app/\"\u003e\n\t\u003cimg src=\"./banner.png\" alt=\"Imagem do projeto finalizado\" style=\"border-radius: 50px;\" height=\"600\"/\u003e\n\u003c/a\u003e\n\n(Link do projeto finalizado: https://dsmeta-elizabetefabri.netlify.app/)\n\n\u003c/div\u003e\n\n## Objetivos do projeto para esta aula - 01\n\n- Criar projetos backend e frontend\n- Salvar os projeto no Github em monorepo\n- Montar o visual estático do front end\n\n## Ferramentas utilizadas no projeto:\n\n- Nodejs 16 e Yarn (vídeo: https://youtu.be/x5tgFTS-CYA )\n- STS (vídeo: https://youtu.be/TGQ0K9QsX88 )\n- VS Code\n  - `IntelliCode`\n  - `ESLint`\n  - `JSX HTML \u003ctags/\u003e`\n\n## Passo: criar projeto Vite ReactJS\n\n![Imagem Caminho Arquivo](https://raw.githubusercontent.com/devsuperior/bds-assets/main/sds/pastas-dsmeta.png)\n\n- Link do site Vite (site: https://vitejs.dev/guide/)\n\n```\nyarn create vite frontend --template react-ts\n```\n\n## Passo: criar projeto Spring Boot\n\n- Link do site Spring Initializr (site: https://start.spring.io/)\n\n- Criar projeto Spring Boot no `Spring Initializr` com as seguintes dependências:\n\n  - Web\n  - JPA\n  - H2\n  - Security\n\n- Ajuste no arquivo pom.xml:\n\n```xml\n\u003cplugin\u003e\n\t\u003cgroupId\u003eorg.apache.maven.plugins\u003c/groupId\u003e\n\t\u003cartifactId\u003emaven-resources-plugin\u003c/artifactId\u003e\n\t\u003cversion\u003e3.1.0\u003c/version\u003e\u003c!--$NO-MVN-MAN-VER$ --\u003e\n\u003c/plugin\u003e\n```\n\n- Botão direito no projeto -\u003e Maven -\u003e Update project (force update)\n\n## Passo: salvar primeira versão no Github\n\n```bash\ngit init\n\ngit add .\n\ngit commit -m \"Project created\"\n\ngit branch -M main\n\ngit remote add origin git@github.com:seuusuario/seurepositorio.git\n\ngit push -u origin main\n```\n\n## Passo: \"limpar\" o projeto ReactJS\n\nVamos pegar o CSS que fizemos nas aulas de preparação:\n\nhttps://github.com/acenelio/dsmeta-css\n\n- **COMMIT: Project clean**\n\n## Passo: Primeiro componente\n\nProjeto HTML/CSS: https://github.com/acenelio/dsmeta-css\n\n- **COMMIT: First component**\n\n## Passo: Outros componentes\n\n- **COMMIT: Other components**\n\n## Passo: Datepicker\n\nDocumentação: https://github.com/Hacker0x01/react-datepicker\n\n```\nyarn add react-datepicker@4.8.0 @types/react-datepicker@4.4.2\n```\n\n```javascript\nimport DatePicker from \"react-datepicker\";\nimport \"react-datepicker/dist/react-datepicker.css\";\n```\n\n```javascript\n\u003cDatePicker\n  selected={new Date()}\n  onChange={(date: Date) =\u003e {}}\n  className=\"dsmeta-form-control\"\n  dateFormat=\"dd/MM/yyyy\"\n/\u003e\n```\n\n- **COMMIT: Datepicker**\n\n## Passo: React Hook useState para manter estado das datas\n\nMacete para criar uma data de X dias atrás:\n\n```javascript\nconst date = new Date(new Date().setDate(new Date().getDate() - 365));\n```\n\n- **COMMIT: useState**\n\n# Objetivos do projeto para esta aula - 02\n\n- Postman (Vídeo: https://youtu.be/CWKLVapcnCU )\n- Heroku CLI (Vídeo: https://youtu.be/70LUh5KNaEk )\n\n## Passo: configuração de segurança\n\n```java\nimport java.util.Arrays;\n\nimport org.springframework.context.annotation.Bean;\nimport org.springframework.context.annotation.Configuration;\nimport org.springframework.security.config.annotation.web.builders.HttpSecurity;\nimport org.springframework.security.config.annotation.web.configuration.EnableWebSecurity;\nimport org.springframework.security.config.http.SessionCreationPolicy;\nimport org.springframework.security.web.SecurityFilterChain;\nimport org.springframework.web.cors.CorsConfiguration;\nimport org.springframework.web.cors.CorsConfigurationSource;\nimport org.springframework.web.cors.UrlBasedCorsConfigurationSource;\n\n@Configuration\n@EnableWebSecurity\npublic class SecurityConfig {\n\n\t@Bean\n\tpublic SecurityFilterChain filterChain(HttpSecurity http) throws Exception {\n\n\t\thttp.headers().frameOptions().disable();\n\t\thttp.cors().and().csrf().disable();\n\t\thttp.sessionManagement().sessionCreationPolicy(SessionCreationPolicy.STATELESS);\n\t\thttp.authorizeHttpRequests((auth) -\u003e auth.anyRequest().permitAll());\n\n\t\treturn http.build();\n\t}\n\n\t@Bean\n\tCorsConfigurationSource corsConfigurationSource() {\n\t\tCorsConfiguration configuration = new CorsConfiguration().applyPermitDefaultValues();\n\t\tconfiguration.setAllowedMethods(Arrays.asList(\"POST\", \"GET\", \"PUT\", \"DELETE\", \"OPTIONS\"));\n\t\tfinal UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();\n\t\tsource.registerCorsConfiguration(\"/**\", configuration);\n\t\treturn source;\n\t}\n}\n```\n\n- **COMMIT: Security config**\n\n### Passo: banco de dados\n\n- Criar entidade Sale\n- Fazer mapeamento objeto-relacional (JPA)\n- Configurar dados de conexão do banco de dados H2\n- Fazer seed do banco de dados\n\n#### application.properties\n\n```\nspring.datasource.url=jdbc:h2:mem:testdb\nspring.datasource.username=sa\nspring.datasource.password=\n\nspring.h2.console.enabled=true\nspring.h2.console.path=/h2-console\n\nspring.jpa.show-sql=true\nspring.jpa.properties.hibernate.format_sql=true\n```\n\n## Criar um arquivo import.sql\n\n#### import.sql\n\n```sql\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Barry Allen',121,67,18196.0,'2022-06-16');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',26,14,4255.0,'2022-06-14');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Padme',55,42,13249.0,'2022-06-14');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Padme',73,65,20751.0,'2022-06-10');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',47,25,7318.0,'2022-06-04');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',72,60,15608.0,'2022-06-03');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',97,68,8901.0,'2022-06-03');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',68,26,13231.0,'2022-06-02');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Barry Allen',73,53,19476.0,'2022-05-22');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',28,23,20530.0,'2022-05-18');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',83,44,4864.0,'2022-05-13');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Barry Allen',82,43,21753.0,'2022-05-06');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',43,26,7362.0,'2022-05-03');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',54,23,10549.0,'2022-04-28');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Padme',125,84,13333.0,'2022-04-25');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',44,26,7431.0,'2022-04-23');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',46,25,21099.0,'2022-04-19');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',42,28,7217.0,'2022-04-19');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',52,21,10107.0,'2022-04-18');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Padme',121,90,18174.0,'2022-04-17');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',65,14,8095.0,'2022-04-12');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Padme',107,74,11507.0,'2022-04-12');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Barry Allen',140,74,11709.0,'2022-04-09');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',95,91,8288.0,'2022-04-08');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',68,43,17016.0,'2022-04-07');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',21,20,17126.0,'2022-04-03');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',38,15,7957.0,'2022-03-31');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Barry Allen',53,29,20903.0,'2022-03-29');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',19,10,3987.0,'2022-03-28');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',78,34,20795.0,'2022-03-27');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',83,44,4938.0,'2022-03-26');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',32,12,6926.0,'2022-03-13');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',64,33,8193.0,'2022-03-13');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Barry Allen',39,39,10557.0,'2022-03-05');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Barry Allen',158,84,21601.0,'2022-03-02');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',12,6,7625.0,'2022-02-29');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Padme',82,82,22465.0,'2022-02-27');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Barry Allen',68,56,12595.0,'2022-02-17');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',27,13,4636.0,'2022-02-16');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',52,33,10155.0,'2022-02-14');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',142,81,13610.0,'2022-02-13');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Padme',81,45,15306.0,'2022-02-08');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',64,35,17460.0,'2022-02-07');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',48,24,21413.0,'2022-02-03');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Barry Allen',150,82,6505.0,'2022-01-26');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',138,95,7983.0,'2022-01-18');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Padme',70,48,9564.0,'2022-01-16');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Barry Allen',162,84,7302.0,'2022-01-15');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',57,54,9126.0,'2022-01-12');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',78,60,5253.0,'2022-01-06');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Padme',81,53,11553.0,'2022-01-04');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',168,92,6299.0,'2021-12-28');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',48,13,22411.0,'2021-12-26');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',107,67,9788.0,'2021-12-24');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Barry Allen',106,62,18942.0,'2021-12-20');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',40,26,11731.0,'2021-12-18');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Padme',101,68,19882.0,'2021-12-18');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Padme',185,100,14618.0,'2021-12-17');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',82,47,7951.0,'2021-12-15');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',86,45,4147.0,'2021-12-14');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Padme',95,88,12943.0,'2021-12-09');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Barry Allen',75,58,18747.0,'2021-12-02');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',96,50,12624.0,'2021-12-01');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',79,40,14770.0,'2021-11-21');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Padme',73,46,14124.0,'2021-11-20');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Padme',92,58,20953.0,'2021-11-20');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',43,30,9690.0,'2021-11-18');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',58,30,11396.0,'2021-11-14');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',49,14,5119.0,'2021-11-14');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',53,23,8206.0,'2021-11-12');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',49,25,8269.0,'2021-11-10');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',53,29,17984.0,'2021-11-09');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',43,26,3056.0,'2021-11-08');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',51,21,8624.0,'2021-11-06');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Barry Allen',64,41,10959.0,'2021-11-03');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',75,23,15883.0,'2021-10-30');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Barry Allen',51,44,14038.0,'2021-10-27');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',141,81,13535.0,'2021-10-26');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Barry Allen',135,98,17241.0,'2021-10-25');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Barry Allen',116,66,16415.0,'2021-10-19');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',60,44,5329.0,'2021-10-14');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',63,32,16618.0,'2021-10-07');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',176,100,5062.0,'2021-10-01');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',118,45,22235.0,'2021-09-29');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',150,97,14484.0,'2021-09-26');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',115,63,18081.0,'2021-09-24');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Padme',159,88,16101.0,'2021-09-23');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',76,45,11150.0,'2021-09-22');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',65,63,17982.0,'2021-09-09');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Barry Allen',90,68,15927.0,'2021-09-08');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',22,12,9793.0,'2021-09-06');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',19,11,4185.0,'2021-09-05');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',68,21,15541.0,'2021-09-04');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Barry Allen',64,47,7287.0,'2021-09-04');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',153,92,17913.0,'2021-09-04');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Padme',93,53,12648.0,'2021-09-02');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',78,32,12021.0,'2021-08-30');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',94,49,18787.0,'2021-08-29');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',54,28,3974.0,'2021-08-28');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',45,25,5681.0,'2021-08-26');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',11,1,4008.0,'2021-08-14');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Padme',118,80,5218.0,'2021-08-13');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',52,21,21220.0,'2021-08-09');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',127,23,8831.0,'2021-08-06');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',78,23,13900.0,'2021-08-04');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Barry Allen',102,52,22086.0,'2021-08-03');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Barry Allen',54,53,15731.0,'2021-07-31');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Barry Allen',173,93,10816.0,'2021-07-22');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',60,45,17633.0,'2021-07-20');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',138,72,14528.0,'2021-07-19');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Padme',147,96,21582.0,'2021-07-17');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Logan',32,12,9751.0,'2021-07-13');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Padme',83,59,8496.0,'2021-07-08');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Padme',58,48,5283.0,'2021-07-07');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Kal-El',55,35,20474.0,'2021-07-05');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Anakin',84,34,5787.0,'2021-07-01');\nINSERT INTO tb_sales(seller_name,visited,deals,amount,date) VALUES ('Padme',79,68,11976.0,'2021-06-27');\n```\n\n- **COMMIT: Database**\n\n### Passo: Primeiro teste de endpoint da API REST\n\n- Criar repository\n- Criar service\n- Criar controller\n\n- **COMMIT: API test**\n\n### Passo: Consulta por data\n\nConsulta customizada:\n\n```java\n@Query(\"SELECT obj FROM Sale obj WHERE obj.date BETWEEN :min AND :max ORDER BY obj.amount DESC\")\nPage\u003cSale\u003e findSales(LocalDate min, LocalDate max, Pageable pageable);\n```\n\n- **COMMIT: Date select**\n\n### Passo: Envio de SMS\n\nDependências Maven do Twilio\n\n```xml\n\u003cdependency\u003e\n\t\u003cgroupId\u003ecom.twilio.sdk\u003c/groupId\u003e\n\t\u003cartifactId\u003etwilio\u003c/artifactId\u003e\n\t\u003cversion\u003e8.31.1\u003c/version\u003e\n\u003c/dependency\u003e\n```\n\nVariáveis de ambiente no application.properties:\n\n```\ntwilio.sid=${TWILIO_SID}\ntwilio.key=${TWILIO_KEY}\ntwilio.phone.from=${TWILIO_PHONE_FROM}\ntwilio.phone.to=${TWILIO_PHONE_TO}\n```\n\nClasse SmsService:\n\n```java\n@Service\npublic class SmsService {\n\n\t@Value(\"${twilio.sid}\")\n\tprivate String twilioSid;\n\n\t@Value(\"${twilio.key}\")\n\tprivate String twilioKey;\n\n\t@Value(\"${twilio.phone.from}\")\n\tprivate String twilioPhoneFrom;\n\n\t@Value(\"${twilio.phone.to}\")\n\tprivate String twilioPhoneTo;\n\n\tpublic void sendSms() {\n\n\t\tTwilio.init(twilioSid, twilioKey);\n\n\t\tPhoneNumber to = new PhoneNumber(twilioPhoneTo);\n\t\tPhoneNumber from = new PhoneNumber(twilioPhoneFrom);\n\n\t\tMessage message = Message.creator(to, from, \"Teste\").create();\n\n\t\tSystem.out.println(message.getSid());\n\t}\n}\n```\n\n- **COMMIT: Twilio SMS**\n\n### Passo: Implantação no Heroku\n\nArquivo `system.properties`\n\n```\njava.runtime.version=17\n```\n\n- Criar app no Heroku\n- Definir variáveis de ambiente:\n  - TWILIO_SID\n  - TWILIO_KEY\n  - TWILIO_PHONE_FROM\n  - TWILIO_PHONE_TO\n\n```bash\nheroku -v\nheroku login\nheroku git:remote -a \u003cnome-do-app\u003e\ngit remote -v\ngit subtree push --prefix backend heroku main\n```\n\n# Objetivos do projeto para esta aula - 03\n\n## Objetivos do projeto para esta aula\n\n- Integrar back end e front end\n- Implantar o front end\n\n## Passo: Primeira requisição com Axios e useEffect\n\n```\nyarn add axios@0.27.2\n```\n\n- **COMMIT: Axios, useEffect first request**\n\n## Passo: Listagem de vendas\n\nDefinição da BASE_URL:\n\n```javascript\nexport const BASE_URL =\n  import.meta.env.VITE_BACKEND_URL ?? \"http://localhost:8080\";\n```\n\n- **COMMIT: Sale listing**\n\n## Passo: Passando as datas como argumento\n\n- **COMMIT: Date update**\n\n## Passo: Enviar notificação\n\n- **COMMIT: Send notification**\n\n## Passo: Mensagem Toast de confirmação\n\n```\nyarn add react-toastify@9.0.5\n```\n\nNo App.tsx:\n\n```javascript\nimport { ToastContainer } from \"react-toastify\";\nimport \"react-toastify/dist/ReactToastify.css\";\n```\n\n- **COMMIT: Toast**\n\n## Passo: Deploy no Netlify\n\nAntes: acrescente `window.React = React` no seu main.tsx conforme abaixo, e salve um novo commit:\n\n```js\nimport React from 'react'\nimport ReactDOM from 'react-dom/client'\nimport App from './App'\nimport './index.css'\n\nwindow.React = React\n\nReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(\n  \u003cReact.StrictMode\u003e\n    \u003cApp /\u003e\n  \u003c/React.StrictMode\u003e\n)\n```\n\nhttps://www.netlify.com/\n\n- Deploy básico\n\n  - Base directory: frontend\n  - Build command: yarn build\n  - Publish directory: frontend/dist\n  - Variáveis de ambiente:\n    - VITE_BACKEND_URL\n\n- Configurações adicionais\n  - Site settings -\u003e Domain Management: (colocar o nome que você quiser)\n  - Deploys -\u003e Trigger deploy\n\n## PARABÉNS!\n\n![Parabéns!](https://raw.githubusercontent.com/devsuperior/bds-assets/main/img/trophy.png)\n\n- Quero muito saber seu feedback\n  - O que você está achando da nossa abordagem?\n  - Você está conseguindo acompanhar?\n  - O que você está achando do evento?\n- Participe\n  - Comente no Instagram e marque a gente @devsuperior.ig\n  - Divulgue seu projeto no Linkedin e marque a DevSuperior\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Felizabetefabri%2Fspring-reactjs","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Felizabetefabri%2Fspring-reactjs","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Felizabetefabri%2Fspring-reactjs/lists"}