More Premium Hugo Themes Premium Html Themes

React Django Blog

Advance Blog Web App made The backend is completely build on Django using Django Rest Framework, while the frontend is completed using ReactJS.

React Django Blog

Advance Blog Web App made The backend is completely build on Django using Django Rest Framework, while the frontend is completed using ReactJS.

Author Avatar Theme by iamrraj
Github Stars Github Stars: 6
Last Commit Last Commit: Feb 1, 2020 -
First Commit Created: Jan 15, 2024 -
React Django Blog screenshot

Overview

Django-React-Blog is a “Blogging Platform” that provides all the general features a blog should have. The backend of the platform is built on Django using Django Rest Framework, while the frontend is built using ReactJS.

Features

  • Login/Registration
  • Minimal Design
  • Create/Edit/Delete Your Posts
  • User Profile
  • Comment Enable On Post Using disqus
  • Comment Count On Post
  • Live Search Blog
  • Filter Blog By Author By Click on Author Name
  • Admin Panel
  • Pagination on All blog list and Live search
  • Create/View/Edit/Delete A User
  • View/Reply All Comments In The Blog
  • View/Edit/Delete All Newsletter In The Blog
  • View/Reply All Comments To A Specific Post
  • Publish/Unpublish A Post

Installation

To install the Django-React-Blog theme, follow these steps:

Backend Setup

  1. Clone this repository: git clone https://github.com/dojutsu-user/Django-React-Blog.git
  2. Change the current directory to the backend folder: cd ./Django-React-Blog/backend/adminapi/
  3. Create a virtual environment and install all backend dependencies with pipenv: pipenv install
  4. Start the virtual environment: pipenv shell
  5. Change the working directory to adminapi which contains the manage.py file: cd ./adminapi
  6. Run python manage.py makemigrations
  7. Run python manage.py migrate
  8. Create a superuser: python manage.py createsuperuser
  9. Run the server: python manage.py runserver

Frontend Setup

  1. Navigate the current working directory to landing: cd ./Django-React-Blog/frontend/blog_frontend/
  2. Install all frontend dependencies using npm: npm install
  3. Run the server: npm start

Creating The First Post

  1. Make sure that both the Backend and Frontend Servers are running.
  2. Open your browser and navigate to localhost:3000.
  3. Go to http://localhost:3000/login/.
  4. Go to the Signup page if you are not registered http://localhost:3000/signup/.
  5. Login with the superuser credentials created while setting up the Backend (Step: 8).
  6. Navigate to Dashboard -> Your all New Post (http://localhost:3000/user/dashboard/create-new-post).
  7. Navigate to Dashboard -> Create New Post (http://localhost:3000/user/addblog/).
  8. Fill the form to create a new post and then submit it.
  9. The submitted post will not appear on the homepage unless and until the admin approves it.
  10. To approve the post, go to Dashboard -> Admin Panel -> View All Posts and then click on the Edit Button.
  11. Check the checkbox labeled Verified and then submit.
  12. After the post gets published, it will be displayed on the homepage of the blog (localhost:3000).

Backend API Documentation

API Documentation is generated using the default tool provided by Django Rest Framework.

To view the API documentation:

  1. Make sure that the Backend Server is running.
  2. Access the API documentation through the provided tool.

Summary

Django-React-Blog is a blogging platform built with Django on the backend and ReactJS on the frontend. It offers a range of features including user registration, post creation, user profiles, comments, search, filtering, admin panel, and more. The installation process involves setting up the backend and frontend servers, creating a superuser, and creating the first post. API documentation is also available for reference.