I am learning web dev and I am planning on developing a simple web app using React: a decision matrix tool.
I need users to be able log in and save their matrices under their profile so I prefer to not use LocalStorage and thus learn more about databases. I am thinking of using JSON as the data format and I will also need to store basics user data for login and their profile.
I wonder how to tackle such a project since so far I have only been using GitHub Pages to host my static websites. Most of what I find by googling seems confusing or irrelevant for such a small-sized project.
My questions are:
What is the simplest way to store, access and edit JSON data as well as user data for a web app?
Are there any simple databases that can be “hosted” together with the app files on a server? Not sure if the question makes sense but I don’t understand where the database is.
What article or resource would you recommend to understand the concepts for data storage?
Ideally you would want to create a backend server using any language/framework e.g nodejs, java, django, php etc and expose the required data through APIs. But, if you don't want to create a separate backend app you can use Firebase database Firestore to save and fetch all of your required data. You can even use firebase hosting to deploy your app. Moreover, firebase also have their Authentication service which you can leverage for your app's authentication.
Related
I'm experimenting with these 2 technologies to make a secure web app [Currently learning React (60%) and Django (<50%). This is intended to be like a medical database, so doctors and nurses enters their patients' information. They need to login obviously. I wanted to implement React-based UI (And not using the classic method to create views from django), so I've found many tutorials just like this one:
https://www.digitalocean.com/community/tutorials/build-a-to-do-application-using-django-and-react
It basically turns Django into a restAPI, and then the React frontend uses axios to retrieve data from the endpoint. Sounds not bad at all (comparing to the native method of rendering data in a webpage from Django), but the problem is that I have no idea on how to make this secure, you know, Django provides an auth system, which is pretty good and secure, I have to say, but in a project with this structure, the auth needs to be done in React, so there many questions appear:
To start with, is it a good idea to make a project of this structure? (If no, then what could be a good one)
If it's a yes, how can I protect the API so only logged in users can interact with it? (What mechanisms to ensure protection)
Yes, this is absolutely a good idea to separate the client application and the backend server application.
You can access the backend through the rest api basically with any frontend framework/app/script.
Customers are able to extend their own applications with the abilities of your backend service.
You can create multiple different frontends that use the same backend or different parts of the same backend via the rest api (multi-branding, reselling). Or you can just swap the frontend framework every second year to a new one.
It's also easier to create different automations by using the rest api.
And the list goes on.
For django rest api auth I would recommend Token Authentication which is already included in the Django REST Framework and for React use this tutorial for implementing the login and the token handling.
And don't forget to use TLS on your servers, and create API documentation. (Example)
I just started learning react. Now I want to build a small application where:
A user can Register/Log In (working with database)
The user can add items to a todo list
The todo list is stored in a database
Do I need other libraries to work with databases?
It's a small application.
Should I use Redux or rather something using MVC pattern like ASP.net?
I don't have any expierence with any of these. After lot of research I am still clueless on where to start with.
As you are a beginner. I would recommend you to use below libraries in both front-end and backend to start with your application
Front-end:
React - works as view layer
axios - to talk to backend database for all CRUD operations
Use localstorage or session storage to work between components. Because your application is very small so you can go with this approach or consider
using redux from now if you feel your application will grow bigger in
future
Back-end:
Keep your back end service as micro-services
As you are already working on react means you know something about javascript so I recommend you write your backend service in nodejs
If you want to use No SQL database then you can go with mongoDB database using mongoose in nodejs
If you prefer SQL database then I would recommend you to start with Postgres SQL database. Postgres SQL is popular these days than
any other SQL database
These are the required libraries for you to start.
I would recommend you to go for MERN stack i.e., MongoDB, Express JS, ReactJS and NodeJS
I would like to ask how to create an ionic app that talks to Laravel API but still works offline when there's no connection.
Let's say i have to write a quiz mobile app in Ionic and it requests for Laravel API to retrieve the questions as well as store the scores in db.
I'm just starting to learn Ionic and i'm really confused right now on how to approach this.
What confuses me most are:
Does the Ionic source live inside the Laravel source code w/c serves the API?
If i want the Ionic app to be installable, should the Laravel source code be included as well during the compilation process?
Thanks in advance for any help.
Your php or in general server side code is completely independent from your ionic application. If you want your app to work offline you should think about something like fetching a high number of information initially and work with this data without making any additional requests.
However your ionic app does only contain the frontend. You could implement some logic for local storage, but if you want to keep information hidden from the user (e.g. solutions) you have to put that logic on a dedicated server.
In the few details you provided, I can say the Laravel code does not live inside the ionic app. The ionic app is separate from the backend API by Laravel. You are possibly trying for a ReST based architecture where you communicate with your Laravel Server with an API. You need to keep those codes separate.
However without any internet, you won't be able to access those APIs, so you will just be able to show some static data, or you could serve from a DB and show later. For how to use the sqlite db you can look here
In your backend you can have an API like
http://example.com/api/v1/questions/1/
Which will fetch a question with options and if you want the app to have the answer for offline storage you may have that as well. When a user answers, you may check whether you have internet access and send answer and verify if you do, else you may save the answer in your DB and sync when you do have access. You can fetch multiple questions so that a user may answer multiple questions in case he/she will not have internet access.
Hope it helps. :)
We are 2 students studying web development.
Right now we are researching and trying to figure out a solution for an ionic app.
the app will have a lot of data content (video, image, music etc)
The questions are: should the APP be developed with a REST api? (seems like the only/best way to connect to a database with ionic?)
or can you build the app with a cloud-based-database without the REST-api (any suggestion for the database?)
and last should we use LocalStorage as our database?
Let me go from bottom to top; if you said you'll use a lot of content in your database - don't even think about local storage. If you really must have a local database as well, consider looking into SQLite (https://github.com/litehelpers/Cordova-sqlite-storage).
The sentence "cloudbased-database without the REST api" honestly makes no sense in Ionic. Let me explain; Ionic uses Angular as its front-end framework. And, front-end is the key word here. You can take any front end framework, or pure vanilla JavaScript for that matter and you will not be able to connect to any database (be it in the cloud, locally, or whereever). It's just not how that's suppose to work.
So, finally, to confirm - yes, you will have to create a (REST) API for your database which will then allow you to "talk to" the database with Ionic.
Hope this clears things up a bit.
I have a Laravel + mySQL app that use either ajax or Angular $http service and I want to integrate websockets into that mix.
So I thought of trying Firebase, which is great and easy to use, but am a bit confused about a couple of things. I am seeking for someone's help in clearing that confusion.
is it possible to change the app url name for firebase ?
So instead of something like https://vivid-torch-xxx.firebaseio.com can I change it to https://myawesomesite.firebaseio.com?
how the schema on Firebase should be structured ?
Or better yet how not to use it all and just use Firebase as websocket server instead of ajax ?
I essentially don't want to have 2 databases to manage the data.
there is a Firebase package for php/laravel, but I don't know why would I need it. Or what exactly is the benefit of using it if am already using a REST-ful backend with angular.
The schema will basically be how you want your JSON for your front-end will read it. Are you displaying notifications? Then investigate how that would be structured. Firebase will give you the power to push updates to the front-end which then will no longer have to pull data via the API on what the actual data is it needs to display the notification.