Simplify frontend

Author: fjsj

.github/workflows/shared-build/action.yml

@@ -46,7 +46,7 @@ runs:
       run: pip install "django>=4,<5"
       shell: bash
     - name: Setup testproject
-      run: django-admin startproject testproject --extension py,yml,json --name Procfile,README.md,.env.example,Dockerfile,Makefile,pyproject.toml,render.yaml --template=.
+      run: django-admin startproject testproject --extension py,json,yml,toml --name Dockerfile,README.md,.env.example,.gitignore,Makefile --template=.
       shell: bash
     - run: |
         npm update --save

CONTRIBUTING.md

@@ -15,7 +15,7 @@ If you made changes to this boilerplate and want to test them, do as follows:
 - Run `git archive -o boilerplate.zip HEAD` to create the template zip file
 - Run the following:
   ```bash
-  cd .. && django-admin startproject theprojectname --extension py,yml,json --name Procfile,README.md,.env.example,Dockerfile,docker-compose.yml,Makefile,pyproject.toml,render.yaml --template=django-react-boilerplate/boilerplate.zip
+  cd .. && django-admin startproject theprojectname --extension py,json,yml,toml --name Dockerfile,README.md,.env.example,.gitignore,Makefile --template=django-react-boilerplate/boilerplate.zip
   ```
 - A new folder called `theprojectname` will be created and now you can test your changes
 - Make sure that the project is still running fine with and without docker

README.md

@@ -69,11 +69,11 @@ Send us an email at [email protected] telling us a bit more about how ou
 - [ ] Open the command line and go to the directory you want to start your project in.
 - [ ] Start your project using:
     ```
-    django-admin startproject theprojectname --extension py,yml,json --name Procfile,Dockerfile,docker-compose.yml,README.md,.env.example,.gitignore,Makefile,render.yaml --template=https://github.com/vintasoftware/django-react-boilerplate/archive/boilerplate-release.zip
+    django-admin startproject theprojectname --extension py,json,yml,toml --name Dockerfile,README.md,.env.example,.gitignore,Makefile --template=https://github.com/vintasoftware/django-react-boilerplate/archive/boilerplate-release.zip
     ```
     Alternatively, you may start the project in the current directory by placing a `.` right after the project name, using the following command:
     ```
-    django-admin startproject theprojectname . --extension py,yml,json --name Procfile,Dockerfile,docker-compose.yml,README.md,.env.example,.gitignore,Makefile,render.yaml --template=https://github.com/vintasoftware/django-react-boilerplate/archive/boilerplate-release.zip
+    django-admin startproject theprojectname . --extension py,json,yml,toml --name Dockerfile,README.md,.env.example,.gitignore,Makefile --template=https://github.com/vintasoftware/django-react-boilerplate/archive/boilerplate-release.zip
     ```
 In the next steps, always remember to replace theprojectname with your project's name
 - [ ] Above: don't forget the `--extension` and `--name` params!
@@ -181,7 +181,7 @@ mkdir -p .github/workflows
 mv proj_main.yml .github/workflows/main.yml
 ```
 
-## Deployment 
+## Production Deployment
 ### Setup
 This project comes with an `render.yaml` file, which can be used to create an app on Render.com from a GitHub repository.
 
@@ -197,17 +197,21 @@ If you are in a private repository, access the following link replacing `$YOUR_R
 
 Remember to fill the `ALLOWED_HOSTS` with the URL of your app, the default on Render.com is `appname.onrender.com`. Replace `appname` with your Render.com app name.
 
-### Configuring Celery
+### Celery
 
 As there aren't free plans for Workers in Render.com, the configuration for Celery workers/beat will be commented by default in the `render.yaml`. This means celery won't be available by default. 
 
 Uncommenting the worker configuration lines on `render.yaml` will imply in costs.
 
 ### SendGrid
 
-To enable sending emails from your application you'll need to have a valid SendGrid account and also a valid verified sender identity. After finishing the validation process you'll be able to generate the API credentials and define the `SENDGRID_USERNAME` and `SENDGRID_PASSWORD` envvars on Render.com. 
+To enable sending emails from your application you'll need to have a valid SendGrid account and also a valid verified sender identity. After finishing the validation process you'll be able to generate the API credentials and define the `SENDGRID_USERNAME` and `SENDGRID_PASSWORD` environment variables on Render.com. 
 
-These variables are required for your application to work on Render.com since it's pre-configured to automatically email admins when the application is unable to handle errors gracefully. 
+These variables are required for your application to work on Render.com since it's pre-configured to automatically email admins when the application is unable to handle errors gracefully.
+
+### Media storage
+
+Media files integration with S3 or similar is not supported yet. Please feel free to contribute!
 
 ### Sentry
 

backend/common/views.py

@@ -1,9 +1,9 @@
 from django.views import generic
 
-from rest_framework import status, viewsets
+from rest_framework import viewsets, status
 from rest_framework.decorators import action
-from rest_framework.permissions import AllowAny
 from rest_framework.response import Response
+from rest_framework.permissions import AllowAny
 
 
 class IndexView(generic.TemplateView):
@@ -19,6 +19,9 @@ class RestViewSet(viewsets.ViewSet):
     )
     def rest_check(self, request):
         return Response(
-            {"result": "If you're seeing this, the REST API is working!"},
+            {
+                "result": "This message comes from the backend. "
+                "If you're seeing this, the REST API is working!"
+            },
             status=status.HTTP_200_OK,
         )

backend/templates/common/index.html

@@ -2,12 +2,12 @@
 
 
 {% block body %}
-  <h1>Django React Boilerplate Example App</h1>
-
-  <p>The setup of the Django React Boilerplate Example App was successful.</p>
-
-  <h2>React Example App</h2>
-  <p>Here is an example of a React app included in the Django framework:</p>
-
-  <div id="react-app"></div>
+  <div class="container">
+    <h1>Django React Boilerplate Example App</h1>
+    <p>
+      Below is an example of a React app included in the Django template.<br/>
+      Check <code>backend/templates/common/index.html</code> and <code>frontend/js/index.js</code> to understand how they're linked:
+    </p>
+  </div>
+  <div class="container" id="react-app"></div>
 {% endblock %}

frontend/js/App.js

@@ -1,17 +1,17 @@
+import * as Sentry from "@sentry/react";
 import React from 'react';
 import { Provider } from 'react-redux';
 
 import Home from './pages/Home';
 import configureStore from './store';
-import SentryBoundary from './utils/SentryBoundary';
 
 const store = configureStore({});
 const App = () => (
-  <SentryBoundary>
+  <Sentry.ErrorBoundary fallback={<p>An error has occurred</p>}>
     <Provider store={store}>
       <Home />
     </Provider>
-  </SentryBoundary>
+  </Sentry.ErrorBoundary>
 );
 
 export default App;