|
所在平台: Udemy |
课程主页: https://www.udemy.com/course/react-avancado/
课程评论：没有评论
**课程名称：** React Avançado: Crie aplicações com NextJS, Strapi e mais **课程概述：** 此课程**已不再更新**，但大部分内容仍然具有参考价值，不过可能存在库/框架的更新。课程将指导学员从零开始构建一个完整的游戏电商网站，涵盖用户功能（搜索、筛选、加入购物车、支付、客户区）和管理员功能（产品、分类、平台管理，促销活动，网站内容编辑，以及自动化的销售邮件）。 **核心技术栈：** * **前端：** ReactJS, Next.js, Styled Components (支持 SSR 和 PWA), Apollo * **后端/CMS：** Strapi, GraphQL * **代码质量与测试：** Eslint, Prettier, Git hooks, TypeScript, Storybook, Cypress (端到端测试) * **持续集成与部署：** CI/CD 流程 **课程重点内容：** 1. **项目架构与开发环境配置：** * 讲解所选技术栈的优缺点。 * 从零开始构建项目样板，配置代码质量工具（Eslint, Prettier, Git hooks, TypeScript）。 * 配置 Styled Components 以支持 SSR 和 PWA。 2. **Strapi 与 GraphQL：** * 使用 Strapi 构建后端/CMS。 * 学习 Strapi API，包括 Content Type Builder, Single Types, Custom Components。 * 创建自定义控制器、服务，集成文档和 GraphQL 插件。 * 学习 GraphQL 查询、过滤和 mutations。 * 自定义 Strapi CMS 界面以匹配商店风格。 3. **Next.js, Storybook, 测试与 Apollo：** * 将 Figma 设计稿转化为响应式 React 组件，使用 Styled Components。 * 为所有组件编写测试，并在 Storybook 中展示不同场景。 * 构建网站页面，确保组件完美集成。 4. **端到端测试 (E2E) 与 Cypress：** * 强调集成测试的重要性。 * 使用 Cypress 编写端到端测试，覆盖用户正常浏览到完成购买的所有流程。 5. **持续集成 (CI) 与部署：** * 讲解项目上线所需的准备工作。 * 创建 CI 管道，实现部署流程的高度自动化。
O curso não possui mais suporte! Muito do material continua ainda relevante, porém podem haver mudanças em bibliotecas/frameworks.Iremos criar um e-commerce de jogos, incluindo toda a parte de pagamentos e área do cliente. Os clientes poderão fazer buscas, filtrar, adicionar ao carrinho e comprar seus jogos favoritos.Teremos também um CMS completamente customizado para que os administradores possam adicionar produtos, categorias, plataformas, criar promoções, editar partes do site, além de emails automatizados para às vendas de cada produto.Para criar tudo isso, iremos utilizar ferramentas muito famosas no mercado de trabalho, como ReactJS, Next, Apollo e outras coisas mais. Sempre prezando pela qualidade do código, ou seja, teremos testes em tudo!Introdução e Arquitetura do ProjetoIremos conhecer a Stack utilizada no curso, tendo explicação de cada uma das escolhas, assim como mostrando os prós e contras de cada uma delasIremos construir nosso boilerplate do zero, aprendendo a configurar as ferramentas de qualidade de código, como Eslint, Prettier, Git hooks e TypeScript. Assim como também configurar o Styled Components para funcionar com SSR e PWA.Strapi e GraphQLVamos iniciar nosso backend/CMS com o Strapi, aprender mais sobre sua API, como o content type builder, single types, custom components. Além de aprender a criar controllers customizados, serviços, instalar plugins de documentação e também do GraphQL, onde iremos aprender como funciona, como criar queries, filtros, mutations e mais.Para finalizar, aprenderemos como customizar o CMS para que ele tenha a cara da loja e se torne uma solução mais interessante para o cliente.NextJS, Storybook, Testes e ApolloEssa que será uma das maiores etapas, é onde vamos aprender a pegar um layout diretamente do Figma e vamos transformá-los em diferentes componentes e estilos.Faremos todos os componentes com styled components, com testes, cenários no Storybook e pensando na responsividade. Com os componentes prontos, construiremos as páginas, ajustando o que for necessário para que tudo se encaixe perfeitamente.Testes E2E e CypressNeste módulo iremos aprender a importância dos testes de integração e como garantir ainda mais qualidade no nosso projeto. Vamos criar testes para todos os fluxos que um usuário normal pode executar em nosso site, desde a navegação normal até uma compra efetuada.CI e DeployNormalmente a maioria dos cursos termina na criação do projeto, mas nunca ensina como fazer para realmente deixar em produção.Aqui nós iremos aprender quais as necessidades do projeto e quais as soluçoes que podemos utilizar. Além disso, iremos criar uma pipeline em um CI para que tenhamos todo o processo de deploy o mais automatizado possível
