Preface

Getting started with full stack development using Python or JavaScript can be daunting, mainly if you are a developer already using one of these languages and want to add a second language to your set of skills. If you are a developer already working with Django or React, or a developer with knowledge in Python or JavaScript and you want to learn how to build a full stack application from scratch with features such as authentication, CRUD operations, and a lot more, but you are also looking to learn how to deploy web applications on AWS using Docker, this book covers everything you need.

This book will help you to discover the full potential practices while combining the dual power of the two most popular frameworks – React and Django. We will build full stack applications including a RESTful API in the backend and an intuitive frontend while exploring the advanced features of both frameworks. We will start building a social media web application called Postagram from scratch while covering the important concepts, techniques, and best practices for end-to-end development.

We will see how the dynamic functionality of the React framework can be used to build your frontend systems and how the ORM layer of Django helps to simplify a database, which in turn boosts the development process of building a backend to build full stack applications.

By the end of the book, you will be able to create a dynamic full stack app starting from scratch on your own.

Who this book is for

This book is for Python developers who are familiar with Django but don’t know where to start when it comes to building a full stack application – more precisely, building a RESTful API. You will also find this book useful if you are a frontend developer with knowledge of JavaScript and looking to learn full stack development. If you are also an experienced full stack developer working with different technologies and you are looking to explore and learn new ones, this book is written for you.

What this book covers

Chapter 1, Creating a Django Project, shows how to create a Django project and make the required configurations with a database server.

Chapter 2, Authentication and Authorization Using JWTs, explains how to implement an authentication system using JSON Web Tokens and how to write custom permissions.

Chapter 3, Social Media Post Management, shows how to implement complex CRUD operations using serializers and ViewSets.

Chapter 4, Adding Comments to Social Media Posts, shows how to add comments to posts using database relations, serializers, and viewsets.

Chapter 5, Testing the REST API, introduces you to testing with Django and Pytest.

Chapter 6, Creating a Project with React, explains how to create a React project while configuring a good environment for development.

Chapter 7, Building Registration and Login Forms, explains how to implement authentication forms and logic on the frontend side of a full stack application.

Chapter 8, Social Media Posts, shows how to implement CRUD operations on the React frontend for social media posts.

Chapter 9, Post Comments, shows how to implement CRUD operations on the React frontend for social media comments.

Chapter 10, User Profiles, explains how to implement CRUD operations on the React frontend concerning profiles and how to upload an image.

Chapter 11, Effective UI Testing for React Components, introduces you to component testing using Jest and the React Testing Library.

Chapter 12, Deployment Basics – Git, GitHub, and AWS, introduces DevOps tools and terms and how to deploy a Django application directly on AWS EC2.

Chapter 13, Dockerizing the Django Project, shows how to dockerize a Django application using Docker and Docker Compose.

Chapter 14, Automating Deployment on AWS, shows how to deploy a dockerized application on EC2 using GitHub Actions.

Chapter 15, Deploying Our React App on AWS, demonstrates how to deploy a React application on AWS S3 and automate the deployment using GitHub Actions.

Chapter 16, Performance, Optimization, and Security, shows you how to optimize your application using webpack, optimize database queries, and enhance the backend security.

To get the most out of this book

You will need Python 3.8+, Node.js 16+, and Docker installed on your machine for this book. All code and examples in this book are tested using Django 4.1 and React 18 on Ubuntu. When installing any React or JavaScript libraries, ensure that you have the latest installation command (npm, yarn, and pnpm) from their documentation, and check whether there are any major changes related to the version used in this book.

If you are using the digital version of this book, we advise you to type the code yourself or access the code from the book’s GitHub repository (a link is available in the next section). Doing so will help you avoid any potential errors related to the copying and pasting of code.

Download the example code files

You can download the example code files for this book from GitHub at https://github.com/PacktPublishing/Full-stack-Django-and-React. If there's an update to the code, it will be updated in the GitHub repository.

We also have other code bundles from our rich catalog of books and videos available at https://github.com/PacktPublishing/. Check them out!

Download the color images

We also provide a PDF file that has color images of the screenshots and diagrams used in this book. You can download it here: https://packt.link/jdEHp.

Conventions used

There are a number of text conventions used throughout this book.

Code in text: Indicates code words in text, database table names, folder names, filenames, file extensions, pathnames, dummy URLs, user input, and Twitter handles. Here is an example: “Once the package is installed, create a new file called pytest.ini at the root of the Django project.”

A block of code is set as follows:

>>> comment = Comment.objects.create(**comment_data)
>>> comment
<Comment: Dingo Dog>
>>> comment.body
'A comment.'

When we wish to draw your attention to a particular part of a code block, the relevant lines or items are set in bold:

ENV = os.environ.get("ENV")
# SECURITY WARNING: keep the secret key used in production secret!
SECRET_KEY = os.environ.get(
   "SECRET_KEY", default="qkl+xdr8aimpf-&x(mi7)dwt^-q77aji#j*d#02-5usa32r9!y"
)
# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = False if ENV == "PROD" else True
ALLOWED_HOSTS = os.environ.get("DJANGO_ALLOWED_HOSTS", default="*").split(",")

Any command-line input or output is written as follows:

pip install drf-nested-routers

Bold: Indicates a new term, an important word, or words that you see on screen. For instance, words in menus or dialog boxes appear in bold. Here is an example: “Finally, select the Permissions tab and select Bucket Policy.”

Tips or important notes

Appear like this.

Get in touch

Feedback from our readers is always welcome.

General feedback: If you have questions about any aspect of this book, email us at [email protected] and mention the book title in the subject of your message.

Errata: Although we have taken every care to ensure the accuracy of our content, mistakes do happen. If you have found a mistake in this book, we would be grateful if you would report this to us. Please visit www.packtpub.com/support/errata and fill in the form.

Piracy: If you come across any illegal copies of our works in any form on the internet, we would be grateful if you would provide us with the location address or website name. Please contact us at [email protected] with a link to the material.

If you are interested in becoming an author: If there is a topic that you have expertise in and you are interested in either writing or contributing to a book, please visit authors.packtpub.com.

Share Your Thoughts

Once you’ve read Full Stack Django and React, we’d love to hear your thoughts! Please click here to go straight to the Amazon review page for this book and share your feedback.

Your review is important to us and the tech community and will help us make sure we’re delivering excellent quality content.

Download a free PDF copy of this book

Thanks for purchasing this book!

Do you like to read on the go but are unable to carry your print books everywhere?
Is your eBook purchase not compatible with the device of your choice?

Don’t worry, now with every Packt book you get a DRM-free PDF version of that book at no cost.

Read anywhere, any place, on any device. Search, copy, and paste code from your favorite technical books directly into your application. 

The perks don’t stop there, you can get exclusive access to discounts, newsletters, and great free content in your inbox daily

Follow these simple steps to get the benefits:

1. Scan the QR code or visit the link below

https://packt.link/free-ebook/9781803242972

2. Submit your proof of purchase
3. That’s it! We’ll send your free PDF and other benefits to your email directly