Remerciez-le!

Remerciez @Admin pour avoir partagé cet document gratuitement, de la manière la plus simple, en partageant sur les réseaux sociaux.

The Ultimate Stack Guide MERN M E R N MongoDB Express.js Node.js React.js Docum

The Ultimate Stack Guide MERN M E R N MongoDB Express.js Node.js React.js Document database Node.js web framework JavaScript web server Client-side JS framework MERN Stack is a Javascript Stack that is used for easier and faster deployment of full-stack web applications. MERN Stack comprises of 4 technologies namely: , , and . It is designed to make the development process smoother and easier MongoDB Express React Node. js Now let’s understand each technology one by one. Using these four technologies you can create absolutely any application that you can think of everything that exists in this world today. The MERN architecture allows you to easily construct a 3-tier architecture (frontend, backend, database) entirely using JavaScript and JSON What is MERN Stack? MongoDB forms the of the ERN stack and works pretty well with the JavaScript ecosystem. M M MongoDB is a NoSQL database in which data is stored in documents that consist of key-value pairs, sharing a lot of resemblance to JSON. The data is not stored in the form of tables and that’s how it differs from other database programs. This is how the data stored in MongoDB looks like: MongoDB MERN Express JS Express is a flexible and clean Node.js web application framework that provides a robust set of features to develop web and mobile applications. It facilitates the rapid development of Node based web applications. In MERN stack, Express will be used as backend API server which interacts with mongoDB database to serve data to client (React) application. Express helps build the backend very easily while staying in JavaScript ecosystem. It is preferred for self-projects as it helps focus on learning development and building projects pretty fast. MERN React JS React is an open-source JavaScript library that is used for building user interfaces specifically for single-page applications. It’s used for handling the view layer for web and mobile apps. React lets you build up complex interfaces through simple Components, connect them to data on your backend server, and render them as HTML. Almost all the modern tech companies from early- stage startups to the biggest tech companies like Microsoft and Facebook use React. The prime reason why react is used, is for Single Page Applications(SPA). SPA means rendering the entire website on one page rather than different pages of the websites. MERN Node JS NodeJS is a cross-platform JavaScript runtime environment, it’s built on Chrome’s V8 engine to run JavaScript code outside the browser, for easily building fast and scalable applications. The main purpose of NodeJS is simple, it allows us to write our backend in JavaScript, saving us the trouble of learning a new programming language capable of running the backend. Node.js is the platform for the application layer (logic layer). This will not be visible to the clients. This is where client applications (React) will make requests for data or webpages. MERN Now let’s dive into what you need to learn in MERN. First and foremost before you dive into any advanced topics, you first need to learn the core of the web i.e. HTML, CSS, and JavaScript. MERN Roadmap HTML provides the basic structure. HTML JavaScript adds interactivity and logic to the website. JavaScript CSS provides the skin to the structure in the form of design, formatting, and layout. CSS Important things to learn HTML Basics Different Tags Forms Semantic HTML SEO Basics Accessibility Best practices Important things to learn Basics Selectors Positioning Box Model Specificity Media Queries Best practices FlexBox Grid Pseudo Elements Pseudo Classes Animations Transitions Responsiveness CSS Important things to learn Basics DOM Fetch API Async Await Event Listeners ES6+ features Best practices Promises Classes Array Methods String Methods Scoping Hoisting Closures JavaScript Once you know enough front-end development, where you can build great projects, then you should consider diving into learning React.js. You might be wondering, what are the prerequisites to learn such a great JavaScript library? There’s only one prerequisite and that is - . JavaScript Keep in mind, do not directly jump into learning React.js, before learning JavaScript, you should be confident with JavaScript because JavaScript is the main thing you’ll be working with. Most importantly, you must understand MERN Roadmap Syntax ES6+ features MERN Roadmap Arrow functions Template literals Array Methods Object property shorthand Destructuring Rest operator Spread operator Promises Async/Await syntax Import and export syntax File & Folder structure Components JSX Props State Events Styling Conditional Rendering MERN Roadmap Basic things to learn in React.js useState useEffect useRef useContext useReducer useMemo useCallback MERN Roadmap Learn about React.js Hooks - the essential hooks to learn: MERN Roadmap Fetching data from APIs Routing Context API Learn to create custom hooks Handling form submits Use cases of less common hooks Higher-Order Components React DevTools Also learn these essential things: MERN Roadmap Then learn some of the React.js UI Frameworks Material UI Ant Design Chakra UI React Bootstrap Rebass Blueprint Semantic UI React MERN Roadmap Learn to use some of the most popular React.js packages React Router Axios Styled Components React Hook Form React Query Storybook Framer Motion MERN Roadmap Learn how to manage state with state management tools Redux MobX Hookstate Recoil Akita MERN Roadmap Learn to test your apps with some of these libraries/frameworks Jest Testing Library Cypress Enzyme Jasmine Mocha Before you dive into backend, you should first consider learning or atleast understanding some of these concepts mentioned below: MERN Roadmap HTTP/HTTPS RESTful APIs CRUD CORS JSON Package Manager MVC architecture GraphQL Now if you feel confident with React.js & concepts mentioned, you can jump into learning . Node.js As mentioned earlier, NodeJS is a cross-platform JavaScript runtime environment that means we can use JavaScript on the server. Isn’t that amazing? With the help of Node.js we don’t have to learn any other programming language. We already know one: JavaScript. Now let’s take a look at, what you need to learn in Node.js, well there's not much specific to NodeJS that you have to learn to build a MERN stack application, here are some related things you should take a look at MERN Roadmap Initialising a npm package MERN Roadmap Installing npm packages through npm or yarn Understanding the package.json file Create a basic http server in Node.js Importing and exports modules Working with FileSystem in Node.js HTTP Protocols Events & Event Emitters Global object It’s the most popular web application framework which uses NodeJS. In MERN stack applications, Express's role is to manage our backend API server. After you know the basics of Node.js you can start learning . Express.js Express is used to listen to a particular port of our server for requests from the client or the frontend. We can create different routes for each endpoint. For example: MERN Roadmap A simple example of Express.js Server. Now, let’s dive into things that you should learn concerning Express, as a MERN stack developer: MERN Roadmap Basic server in Express Creating & handling routes MERN Roadmap Learn Middlewares CRUD operations Error Handling Using MVC Architecture Authentication & OAuth API Versioning Rate Limiting Creating custom middlewares Reading JSON form data sent from frontend via middleware express.json() Once you know how to use Express.js and you’ll start creating projects, you’ll notice that you need some kind of database to stores data of your applications, data such as (user profiles, content, comments, uploads, etc.) And that’s where comes into play. We use MongoDB because it’s the most popular one, and it works well in the JavaScript ecosystem, because it’s just similar to JSON. MongoDB JSON documents created in your React.js front end can be sent to the Express.js server, where they can be processed and (assuming they’re valid) stored directly in MongoDB for later retrieval. Concepts to learn in mongoDB are: MERN Roadmap MERN Roadmap SQL Vs NoSQL MongoDB database structure Setting up local MongoDB or cloud MongoDB Atlas database Perform CRUD operations on the database (Create, Read, Update & Delete) Indexing Aggregations Ad-hoc query Creating models and schemas To interact with MongoDB better, we generally use an ODM or Object Data Modelling library like . Mongoose Important things to learn in Mongoose: Mongoose is an Object Data Modeling (ODM) library for MongoDB and Node.js. It manages relationships between data, provides schema validation, and is used to translate between objects in code and the representation of those objects in MongoDB. MERN Roadmap Defining the Schema Mongoose data validation Understanding mongoose pre and post hooks Also there are some essential things you should learn to become a fantastic MERN stack developer. MERN Roadmap Git GitHub Terminal (CLI) Postman Payment Gateways Testing MERN Roadmap Learn to deploy your frontend Netlify Vercel Firebase Github Pages Render Some popular free websites that you can use to deploy your frontend application or client-side code. MERN Roadmap Learn to deploy your backend The 2 popular free services that you can use to deploy your backend application or server-side code. Vercel Heroku MERN Roadmap You can also use any popular cloud service, almost all cloud services offer 1 year free trial, but you need to uploads/Geographie/ the-ultimate-stack-guide-mern-m-e-r-n.pdf