Your Web News in One Place

Help Webnuz

Referal links:

Sign up for GreenGeeks web hosting
February 25, 2022 01:16 pm GMT

What are Redux, Typescript, Webpack, WebSocket and Base64? How we install or use in our New and Existing project?

I just learned new technology and am still learning. Those are Redux, Typescript, Webpack, WebSocket and Base64. Now I write below some short notes about this topic from their documentation.

Redux: Redux - A predictable state container for js apps. It works with any UI layer; it has a large ecosystem of addons to fit our needs. It helps us to write application that behave consistently, run in different environments and easy to test. Its devtools make easy to trace when, where, why and how our applications state changed.

Typescript: TypeScript is a strongly typed programming language that builds on javascript. It gives us better tooling at any scale.

Webpack: It is a module bundler. Its mainly used to bundle JavaScript files for usage in a browser.

WebSocket: The WebSocket API is an advanced technology that makes it possible to open a two interactive communication session between the users browser and a server. With this API, we can send messages to a server and receive event-driven responses without having to poll the server for a reply.

Base64: It is a encode-decode schemes that represent binary data in sequences of 24 bits that can be by four 6-bit Base64 digits.

Now I told how we add Redux in ours react project!

React Redux is the official React UI bindings layer for Redux. Below I take a image for installation Redux on React in a new Project

Installation:

Image description

For existing React project we can follow below steps for installation:

Image description

Now I told how we add Typescript in ours react project!

When we install or add typescript command on our react project. This command is automatically setup typescript compiler, webpack, babel etc on our react project

Installation:

Image description

After installation we see that our file extension will be on .tsx format. But if we rename file .ts format; this code will show error. Because typescript file name will be on .tsx extension format.. Than we will continue our projects.

Setup react with webpack and babel

  1. Setup React. - Setup folder with npm and git. - Create HTML and Javascript (React) file.
  2. Setup webpack. - Install webpack. - Add configuration file.
  3. Setup Babel. - Install babel. - Configure webpack to use babel.
  4. Build and run.
  5. Extra useful configs. - Babel config for CSS files.

Thats all from today. Best of luck everyone.


Original Link: https://dev.to/lukmanhossain/what-is-are-redux-typescript-webpack-websocket-and-base64-how-we-install-or-use-in-our-new-and-existing-project-5792

Share this article:    Share on Facebook
View Full Article

Dev To

An online community for sharing and discovering great ideas, having debates, and making friends

More About this Source Visit Dev To