Wix Clone

Clone wix

Clone Wix funcional completo criado em React, Express e MongoDB. Tem funcionalidade de queda de arrasto, gerenciamento de páginas, configurações junto com animações, pesquisa de imagens etc.

Demo: https://wixclone.onrender.com/

Características

• Interface de arrastar e soltar
• Crie site de várias páginas
• Pesquisa de imagem Pexels, portanto, é fácil encontrar a imagem correta de royalty grátis.
• Tem efeitos de animação embutidos que podem ser aplicados em qualquer lugar
• Pode criar layouts personalizados
• Cria o site gerado pelo usuário Preveiew para mostrar em seu painel.
• O ninho de elementos é possível.
• Painel de camadas com efeito de pairar mostrado no elemento
• Publicação do site do usuário no link exclusivo para o usuário
• Visualização responsiva para as páginas geradas pelo usuário
• Google Font Manager, para gerenciar fontes do Google para a página em um único local.
• Opções detalhadas de edição de elementos
• Opções de modificação do layout
• Configurações de SEO como título da página, descrição, favicon junto com a visualização. (To be implemented)
• CRADIENTES CSS Criador para o fundo
• Elemento mínimo de altura ajustador
• Página de visualização para sites não publicados, que mostrarão apenas a visualização do usuário autorizado.
• Painel de gerenciamento de sites

Como correr

Front-end

1. npm install -y para instalar os dependentes necessários.
2. Crie o arquivo .env no diretório com os seguintes detalhes.
   REACT_APP_GOOGLE_API_KEY="[Google font API KEY : https://developers.google.com/fonts/docs/developer_api]"
REACT_APP_PEXELS_API_KEY="[Pexels API key : https://www.pexels.com/api/]"
   
3. npm run build para criar uma versão de construção do front-end.
4. (Se você deseja modificar o front -end, você pode npm start o front -end e npm run dev para o back -end)

Back -end

1. Copie a pasta de construção gerada na pasta de back -end.
2. cd backend/ vá na pasta de back -end.
3. npm install -y para instalar as dependências
4. Crie o arquivo .env no diretório com os seguintes detalhes.
   JWT_SECRET=" [RANDOM STRING USED TO CREATE JWT TOKEN ]"
PORT=8000
API_DB_NAME="[DATABASE_NAME]"
API_LOGIN_PERIOD="2d"
API_MONGO_URI="[ REMOVED FROM THE CODE ]"
API_MONGO_PASS="[ MONGODB PASSWORD ]"
API_MONGO_USER="[ MONGO DB NAME ]"
API_MONGO_LOCATION="[ mongodb for local instance, mongodb+srv for remote "]
   
5. npm run dev para executar em uma máquina local. Para implantação, use node ./src/server.js
6. Deve estar disponível na porta 8000.