foschieraanderson/gallery-django-react

Galeria de imagens desenvolvida com Django e React JS.

Galeria de Imagens

Uma aplicação para visualizar suas imagens com múltiplo upload de imagens e painel de administração. API feita com Django e SPA com React JS.

TABLE OF CONTENTS

• Screenshots
• Getting Started
  • Requirements
  • Cloning
• Setup
• Tests
• Technologies

Screenshots

API	Insomnia

Galeria	Uploads

Getting Started

Requirements

• Python
• Node
• NPM ou Yarn

Cloning

• Clonando o repositório

    $ git clone https://github.com/foschieraanderson/gallery-django-react.git
  

Setup

Vamos começar subindo a API

• Entre na pasta do projeto

    $ cd gallery-django-react

• Inicie um ambiente virtual com sua ferramenta de preferência, eu vou usar poetry

  # Com o ambiente ativado vamos instalar as dependências
  
   $ poetry install
  

• Gere uma secret_key para o seu projeto através do seu terminal

  # gerando SECRET_KEY
    $ python -c "import secrets; print(secrets.token_urlsafe())"

• No diretório api edite o arquivo settings

  # Editando o arquivo settings.py
  
    # Cole a sua secret_key aqui
    - SECRET_KEY=YOUR_SECRET_KEY
  

• Criando as tabelas no banco de dados

  # Gravando as alterações nas migrations
  
   $ poetry run python manage.py makemigrations
  
  # Gerando as tabelas
  
   $ poetry run python manage.py migrate
  

• Rodando a API

  # Iniciando o servidor django
  
   $ poetry run python manage.py runserver
  

• Neste momento você consegue acessar a api através do seu navegador no endereço http://127.0.0.1:8000

• Você vai querer acessar o painel administrativo na rota http://127.0.0.1:8000/admin e para isso você vai precisar de um usuário

  # Criando um usuário
  
   $ poetry run python manage.py createsuperuser
  

Agora podemos iniciar nosso frontend

• Entre na pasta do projeto

    $ cd web/

• Instalando as dependências da aplicação

    $ yarn install

• Rodando a aplicação web

    $ yarn start

• Nesse momemnto a sua aplicação está rodando no endereço http://127.0.0.1:3000

Tests

• Vamos rodar os testes para garantir que está tudo conforme o esperado

  $ poetry run pytest

Technologies

• Python
• Django
• Django Rest Framework
• SQLite
• Swagger
• Poetry
• React
• Typescript
• Yarn
• Styled-components

---

</> foschieraanderson