Na VTEX existem diversos produtos e aplicações para diferentes necessidades e fins e, por isso, cada um possui seu próprio design system com uma identidade visual única que se aplica ao seu contexto de usuários.
No contexto da empresa, um design system é composto por diferentes componentes React que seguem um tema configurado com ThemeUI. Considerando as singularidades de cada um, existe a necessidade de haver diferentes documentações que demonstrem os variados casos de uso dos componentes.
A ideia desse projeto é criar diversos componentes para que desenvolvedores de design system possam usar nas suas documentações, a fim de demonstrar as funcionalidades de seus componentes e suas especificações de design.
A primeira vantagem é que a aprendiz ou o aprendiz terá uma experiência inicial com o ecossistema da VTEX, tendo a oportunidade de trabalhar em conjunto com membros da parceria com a UFCG e também com funcionários da empresa para alinhar seu progresso. Dessa forma, haverá uma troca tanto de conhecimento técnico como também de cultura, o que poderá contribuir para o seu crescimento profissional.
Além disso, a aprendiz ou o aprendiz estará ajudando a criar uma base que será irá potencialmente deixar um impacto real no processo de desenvolvimento dos funcionários (desenvolvedores e designers) da VTEX. Vai ficar de fora dessa?
- Javascript
- Typescript
- React
- ThemeUI
- Reakit
- MDX
- Storybook
- Jest
- https://primer.style/doctocat
- https://www.gatsbyjs.org/packages/@rocketseat/gatsby-theme-docs/
- https://www.gatsbyjs.com/tutorial/writing-documentation-with-docz/
Espera-se que a aprendiz ou o aprendiz já tenha noção de desenvolvimento web com tecnologias modernas (JavaScript, HTML e um pouco de CSS) para facilitar o processo. É desejável também que tenha conhecimento de componentização e de React, que será a principal tecnologia utilizada.
- Fase de aprendizado
- Planejamento da arquitetura e funcionamento do código
- Configuração do(s) repositório(s)
- Configuração para componentes terem estilos customizáveis
- Implementação do PropsTable para exibir propriedades de um componente, incluindo suas descrições e valores possíveis
- Implementação do Usage para demonstrar a importação e utilização básica de um componente
- Implementação do CodeBlock para exibir blocos de código ilustrando uso dos componentes
- Implementação do LiveCode para permitir edição de código com resultados em tempo real
- Integração com Codepen, CodeSandbox e semelhantes
- Implementação do componente de Guidelines
Robson Junior trabalha atualmente na parceria entre UFCG e VTEX como desenvolvedor de software, com ênfase em desenvolvimento web, e é membro do core team da OpenDevUFCG. É estudante de Ciência da Computação na UFCG, cursando o nono (e penúltimo) período da graduação.
- Discord:
JRobsonJr#6574 - E-mail: jrobsonjr16@gmail.com
- GitHub: JRobsonJr
- LinkedIn: JRobsonJr
- Twitter: JRosboJr