3d Product Preview
3D Product Preview
šŗšø Do not speak Portuguese? Click here to view the english version.
3D Product Preview Ć© uma aplicaĆ§Ć£o web permite aos usuĆ”rios visualizar sofĆ” "Aidian Corner II" em 3D antes de efetuar a compra. Com uma interface moderna e intuitiva, a plataforma oferece uma experiĆŖncia imersiva e interativa, que permite aos usuĆ”rios visualizar o produto em 3D.
Ele foi desenvolvido com um viƩs didƔtico para aprender sobre a biblioteca ThreeJS e como criar visualizaƧƵes de modelos 3D em tempo real usando JavaScript.
Tecnologias utilizadas
- Vite para o build e desenvolvimento da aplicaĆ§Ć£o.
- Svelte para a construĆ§Ć£o da interface.
- TypeScript para a tipagem dos dados.
- SASS para a estilizaĆ§Ć£o dos componentes.
- Three.js para a execuĆ§Ć£o de modelos 3D no navegador.
- Threlte para renderizar cenas three.js no Svelte.
DemonstraĆ§Ć£o
A aplicaĆ§Ć£o estĆ” disponĆvel para acesso pĆŗblico em: 3d-product-preview.vercel.app
ExecuĆ§Ć£o local
Como executar a aplicaĆ§Ć£o
Para executar a aplicaĆ§Ć£o, Ć© necessĆ”rio ter o Node.js instalado em sua mĆ”quina. ApĆ³s isso, basta clonar o repositĆ³rio, entrar no diretĆ³rio da aplicaĆ§Ć£o e utilizar os seguintes comandos em seu terminal:
# InstalaĆ§Ć£o de dependĆŖncias
$ npm install
# ExecuĆ§Ć£o da aplicaĆ§Ć£o
$ npm run dev
Como gerar e executar a build da aplicaĆ§Ć£o localmente
Para gerar e executar a build da aplicaĆ§Ć£o, basta utilizar o seguinte comando no terminal:
# Gerar o build da aplicaĆ§Ć£o
$ npm run build
# Executar o preview do build da aplicaĆ§Ć£o
$ npm run preview
š Projeto desenvolvido por Erick Nathan.
