Skip to main content

Integrating Frontend to Backend | MERN stack(100% working)

How to Integrate frontend to backend in MERN stack?

For integrating the frontend to backend just do two things.

Step1: Go and install cors on both side (front end as well as backend)

             To install cors simply open the folder into terminal and type npm install cors--save.

step 2: just go to your front end section(react app) open package.json file.
    
           and just add one line into package.json file.

          "proxy":"http://localhost:4000"

here i am using 4000, so what is 4000 ?. this is the port  on which our backend is listening. so it may be possible that u may have other port number on which your server is listening. so put yours port number on which your backend server is listening. and this proxy thing we have to add in frontend part not in backend part.

Now it may be possible that you want to know about cors.
so basically cors(Cross origin resource sharing) is a package. and by using this package we can communicate with other servers or we can send our data or files among each other. so it is basically a middleware. which makes us able to inetract with applications which is running on different ports.

Comments

Popular posts from this blog

Symmetric Tree | Interview Problem

Introduction: In this tutorial we are going to solve a good question which will clear your doubts on how BFS or level order traversal is useful to solve binary tree problems. this is basically a question from Leetcode, and it is really very good problem to practice BFS. Problem Statement: Given a binary tree, check whether it is a mirror of itself (ie, symmetric around its center). For example, this binary tree [1,2,2,3,4,4,3] is symmetric: But the following [1,2,2,null,3,null,3] is not: Link : Leetcode Link please make binary tree on paper by the given array above. and you will get a clear picture of the problem. what we are going to do in this problem. Solution: As we know we are going to apply BFS to solve this problem. actually you have to just get one thing to solve this problem. we will perform BFS, but with little change or modification. So first we will store the root->val in a vector or array of the left subtree. and during this we will first insert left child and then ...

Construct Binary Tree from preorder and inorder | Data Structure

Introduction: In this tutorial we are going to see how we can construct the binary tree from given preorder and inorder. Prerequisites: you should know about binary tree traversal and on paper you can draw binary tree from given preorder and inorder traversal. Inorder:left->root->right; Preorder:root->left->right; Problem Statement: we have given two arrays. one for preorder and another for inorder. by using these two array we have to built a binary tree. eg: preorder = [3,9,20,15,7] inorder = [9,3,15,20,7] solution: Solution: We will follow recursive approach to solve this question.let's discuss how we can solve it. Trick: In the given preorder the very first element will be the root of the tree. then we will find root element in inorder also. and we know in inorder traversal we have left part then root and then right part of the tree. by using preorder we can get the root of the main tree and by using inorder and root we can get the left part and right part of the...

Linked List Data Structure | Creation and Traversal

Introduction: In this tutorial we will create our linked list. Before writing code let's understand key words related to linked list: 1. Head:    first node of the linked list is called the head of the list. and this node is most important. 2.Tail:       last node is called the tail of the list which must points to  null.            step1: For creating the list first of all let's declare the structure of Nodes of the list: struct Node{ int val; struct Node *next; } step2: write main function: int main(){     int n;     cout<<"enter the number of Nodes:";     cin>>n;     struct Node* head = NULL;     struct Node* temp;     int m;     while(n--){         cout<<"enter the data into nodes:";         cin>>m;    ...