Cloudinary

In this post, we will build a Cloudinary uploader through which we will be able to upload images through our app to cloudinary. We will use ReactJS and NodeJS in the project.

So, open your terminal and create a new folder and inside that folder create a new react app called frontend.


FaunaDB

In this post, we will build a Snippet app in Next.js. We will store and retrieve our data from FaunaDB and also use Tailwind CSS in the project. We will also be using the awesome authentication service of Auth0 in the project

So, open your terminal and create a new Next.js application by using the command below.

npx create-next-app snippet-app-nextjs

Now, as per the instructions, change to the newly created folder. I have also opened the project in VS Code. After that, run npm run dev to start the project.


Photo by Janis Fasel on Unsplash

The next app with NextJS, which we will build is the Pokedex app and we will also be using Tailwind CSS in it.

So, open your terminal and create a new Next.js application by using the command below.

npx create-next-app pokedex-nextjs

Now, as per the instructions, change to the newly created folder. I have also opened the project in VS Code. After that, run npm run dev to start the project.


Code

Continuing our Next.js journey, the next application which we will build is a blog. We will use Ghost CMS for our blogs and Next.js for the frontend.

So, open your terminal and create a new Next.js application by using the command below.

npx create-next-app ghost-nextjs

Now, as per the instructions, change to the newly created folder. I have also opened the project in VS Code. After that, run npm run dev to start the project.


Photo by Avinash Murugappan on Unsplash

Continuing our NextJS journey, the next app which we will build is the Cryptocurrency price tracker app, which will show a nice interface showing latest prices of top ten cryptocurrencies.

So, open your terminal and create a new NextJS app by below command.

npx create-next-app crypto-next

Now, as per the instructions change to the newly created folder. I have also opened the project in VSCode. After that run npm run dev to start the project.


Photo by ThisisEngineering RAEng on Unsplash

After completing the crash course in the previous blog, it time to create an app with Next.js. So, we will create a News app with Next.js, which will fetch data from the News API.

Now, to create a Next.js app we need to use the below command, inside any folder. The only requirement, is that Node.js and npm should be installed on the machine.

npx create-next-app next-news

Now, as per the instructions change to the newly created folder. I have also opened the project in VSCode. After that run npm run dev to start the project.


Photo by AltumCode on Unsplash

Next is a React web framework that enables server-side rendering and static site generation. So, it is built on top of React and gives you extra features which are perfectly suited for larger production apps.

Server-Side Rendering
Unlike a traditional React app where the entire application is loaded and rendered on the client-side, Next.js allows the first-page load to be rendered by the server, which is great for SEO and performance.

Other Next.js Benefits These are some of the other benefits of Next.js: 1. Easy page routing- No need for react-router-dom 2. API Routes- Create API routes like Node.JS 3…


News App

In this post we are going to make a news app and will use the newsapi for the same.

So, open up a terminal and create a new flutter app using the below command.

flutter create news_api_app

After that cd into the folder and open the code in VSCode. I have also connected my physical device to my computer via USB.

On running the app from Run ->Start without debugging , i will get the basic app running on my phone.

The basic app will be shown on my phone. Now, we will update our main.dart file and remove most…


React

When it comes to start a react project, we all use the familiar create-react-app by Facebook engineers.This create-react-app stores the logic to use, Babel and Webpack behind the scene to make our React application work in the browser.

We can also configure a React app, without using create-react-app and we will be doing the same in this project.Now, even before we start configuring our project, we should know what is Webpack and Babel.

Webpack is a module builder. It should be noted that webpack doesn’t runs during your page load, but it runs during your development.

Look at the below…


Final Space

Welcome to a new React JS project, where we are going to build a simple app using Final Space API in React.

So, fire up your terminal and create a new react app final-space-react with the below command.

Nabendu Biswas

UI Lead- ReactJS, JavaScript and everything in-between.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store