First Django + React Native project

all obviusly inside a virtual env

• pip3 install Django djangorestframework

django-admin startproject API

python manage.py migrate

python manage.py startapp api_rest

python manage.py createsuperuser

after creating serializer.py with his respective code, we can create an object in Article's table by console for this: python manage.py shell

    from api_rest.models import Article
    from api_rest.serializers import ArticleSerializer
    from rest_framework.renderers import JSONRenderer
    from rest_framework.parsers import JSONParser
    a = Article(title="Titulo del articulo", description = "esta es la descripcion")
    a.save()

    serializer = ArticleSerializer(a)
    serializer.data
{'title': 'Titulo del articulo', 'description': 'esta es la descripcion'}
    ...

At this point I've translated the Article Model into python native data types, dictionaries

render data into json

    ...

    json = JSONRenderer().render(serializer.data)
    json
b'{"title":"Titulo del articulo","description":"esta es la descripcion"}'

    import io
    stream = io.BytesIO(json) 
    data = JSONParser().parse(stream) 
    serializer = ArticleSerializer(data=data)
    serializer.is_valid()
True
    serializer.validated_data
OrderedDict([('title', 'Titulo del articulo'), ('description', 'esta es la descripcion')])

python manage.py shell

>>> from api_rest.serializers import ArticleSerializer
>>> serializer = ArticleSerializer()
>>> print(repr(serializer)) 
ArticleSerializer():
    id = IntegerField(label='ID', read_only=True)
    title = CharField(max_length=100)
    description = CharField(style={'base_template': 'textarea.html'})
>>> 

we can also write our API views using class-based views. rather than function based views (as I did in the previous section). This is a powerfull pattern that allows us to reuse common functionality, and helps us to keep our code DRY (Don't Repeat Yourself).

One of the big wins of using class-based views is that it allows us to easily compose reusable bits of behaviour.

The create/retrieve/update/delete operations that we've been using so far are going to be pretty similar for any model-backed API views we create. Those bits of common behaviour are implemented in REST framework's mixin classes.

REST framework includes an abstraction for dealing with ViewSets, that allows the developer to concentrate on modeling the state and interactions of the API, and leave the URL construction to be handled automatically, based on common conventions.

The ViewSet class inherits from APIView. You can use any of the standard attributes such as permission_classes, authentication_classes in order to control the API policy on the viewset.

The ViewSet class does not provide any implementations of actions. In order to use a ViewSet class you'll override the class and define the action implementations explicitly.

The GenericViewSet class inherits from GenericAPIView, and provides the default set of get_object, get_queryset methods and other generic view base behavior, but does not include any actions by default.

In order to use a GenericViewSet class you'll override the class and either mixin the required mixin classes, or define the action implementations explicitly.

The ModelViewSet class inherits from GenericAPIView and includes implementations for various actions, by mixing in the behavior of the various mixin classes.

The actions provided by the ModelViewSet class are .list(), .retrieve(), .create(), .update(), .partial_update(), and .destroy().

    npx create-expo-app project-name

    cd project-name
    npm start # you can also use: npx expo start

or... To run your project, navigate to the directory and run one of the following npm commands.

• cd project-name
• npm run android
• npm run ios # you need to use macOS to build the iOS project - use the Expo app if you need to do iOS development without a Mac
• npm run web

https://callstack.github.io/react-native-paper/getting-started.html

    npm install react-native-paper

you can send data through components with props. props are inmutable and not changeable

so if you want to change the value of the argument, you can use:

you can use state to change the value of the argument

has scroll

    python manage.py runserver 192.168.56.1:80  

had to change the port of the api to this one, because the default one was giving problems

https://reactnavigation.org/docs/getting-started

    npm install @react-navigation/native

dependencies if using Expo: npx expo install react-native-screens react-native-safe-area-context

dependencies if using React Native CLI: npm install react-native-screens react-native-safe-area-context

also need to install stack Navigator https://reactnavigation.org/docs/stack-navigator/

Expo: npm install @react-navigation/stack

React Native CLI: npm install react-native-gesture-handler