Connect with Digiprima Technologies at InnoEx 2024 (HKTDC) – Hong Kong
Today, most businesses are making their business easy and simple by using software applications as an important part. It is easy to build mobile applications such as hybrid apps, and cross-platform apps using React Native.
In the most recent quarter, the total value of global consumer remittances on mobile apps was US$33 billion, up over 40 percent compared to the same quarter in 2020. Between 2019 and 2021, there has been an experience in consumer spending on mobile apps. Continued growth, climbing to US$ 170 billion during 2021.
Create Your First React Native Mobile App With Django
The mobile revolution is transforming the way people consume information and interact in their daily lives. As mobile experiences become more convenient and enjoyable, businesses need to innovate quickly by creating better user experiences on the go. Nowhere is the need for higher-level abstractions of common web development patterns, shortcuts for frequent programming tasks, and clear conventions for how to solve problems more apparent than in mobile app development. In this article, let us take a look at React Native and Django for mobile app development and understand them from the perspective of a beginner.
Purpose of React Native
React Native is an application framework created by Facebook that enables developers to build native apps for both iOS and Android using a single codebase. Though React Native is similar to other JavaScript frameworks, such as Ember, AngularJS, and Backbone, it offers many unique advantages over the competition. You can use React Native to quickly develop cross-platform applications that are not only user-friendly but also highly efficient.
React and React Native is used by various tech companies like Netflix, Facebook, Instagram, Skype, Facebook Ads, and Tesla.
Purpose of Django
Django inherits all the best features of Python and makes it easy to build powerful and dynamic web applications that can be used on Web, mobile, and desktop apps. It is flexible and can easily scale up to handle high-load applications. Django inherits all the best features of Python and makes it easy to build powerful and dynamic web applications that can be used on Web, mobile, and desktop apps. Django is used by numerous organizations, including Yelp, Disqus, and YouTube. Machine learning is easy to implement on a Django application due to its high level of flexibility and compatibility with other programming languages like Python. The framework is optimized for developing high-performance web applications and websites with stateless workloads.
React Native and Django are used together
React Native, or RN as it is often called will allow you to build mobile applications with a single code base that can run on iOS, Android, and the Web. Django is a flexible and powerful Python web framework, which allows you to use the full power of MySQL, PostgreSQL, or SQL Server. Both frameworks have many advantages over others in the industry and help make your app development faster and more efficient. With a huge community base, React Native also features one of the largest tenets. On the other hand, Django is an open-source/free software web framework that mainly serves as a backend engine for applications. It's an easy-to-use Python language with multiple packages like Django-admin; hence accessibility to others is made easier
The Django and React Native libraries are quite helpful but make up a small part of the full set of tools needed. The most important is the REST framework and React Native, which together allow your application to interact with the frontend (React Native) and backend (i.e. create APIs, and retrieve data). so if your application is going to be interactive, you need to build an API (Application Programming Interface) on the backend using the Django REST framework, one of many immensely useful Django libraries.
React Native / Django Implementation for Beginners
The following section shows a basic tutorial on how to start coding with these two frameworks.
Setting up a React Native project
Step 1: First you need to install node and watchman. To do so, run the following commands on the terminal, after installing Homebrew.
brew install node
brew install watchman
Step 2: Installing an iOS Simulator in Xcode
To install a simulator, open Xcode> Preferences... and select the Components tab. Select a simulator with the corresponding version of iOS that you wish to use.
sudo gem install cocoapods
Step 3: Creating the project folder
npx react-native init AwesomeProject
Once you run the above command in the terminal, it will generate a project with a folder structure for iOS and Android.
Step 4: Start the Metro JavaScript bundler.
npx react-native start
Step 5: Start the Application in the iOS simulator
To do so, run the command below.
npx react-native run-ios
Setting up Django
Install python and pip and then run the following commands to install the corresponding packages.
pip install django
pip install djangorestframework
Step 1: Navigate to any folder that you want to use to create the Django project, open the command prompt, and enter the following command:
Django-admin start project Sample Project
Step 2: Navigate to the project folder and create a web app using the command below:
python manage.py startapp MyApp
Step 3: Open the settings.py file and add the lines of code mentioned below, in the INSTALLED_APPS section:
'rest_framework',
'MyApp',
Step 4: Open views.py inside the MyApp folder and add the lines of code mentioned below:
from django.shortcuts import render
from django.http import Http404
from rest_framework.views import APIView
from rest_framework.decorators import api_view
from rest_framework.response import Response
from rest_framework import status
from django.http import JsonResponse
from django.core import serializers
from django.conf import settings
import json
# Create your views here.
@api_view (["POST"])
defIdealWeight(heightdata):
try:
height=json.loads(heightdata.body)
weight=str(height*10)
returnJsonResponse("Ideal weight should be:"+weight+" kg",safe=False)
exceptValueErrorase:
returnResponse(e.args[0],status.HTTP_400_BAD_REQUEST)
The IdealWeight(heightdate) is the method that gets executed when an API call is made. It has a simple logic to calculate weight (=height*10). The line return JsonResponse(…) will send the response back.
Step 5: Open urls.py and add the lines of code mentioned below:
from django.conf.urls import url
from django.contrib import admin
from MyApp importviews
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^idealweight/',views.IdealWeight)
]
Step 6: We can start the API using the commands below, in the command prompt:
python manage.py run server
The above instructions depict a basic setup for the Django project. We can also use more routes, functions, and middleware, to add more functionality to REST APIs.
