Micro-front end web app using webpack, react and angular(latest version) - javascript

I want to create a web application using JavaScript frameworks. The basic idea is to create a simple navbar through which we can switch to Angular and react module. I want to use webpack as a base library for hosting front-end app. For state management, I want to use rxjs
Can anyone help me in that?

Related

how can i embed javascript developed by Create React App

I want to use javascript library on github in my project but I don't know how to do it.
the scripts are "https://github.com/ReyhaneMasumi/mapbox-gl-draw-scale-rotate-mode"
Is there any way to use this library on plain web app project?
You just should check installation and usage guide in README.md:
https://github.com/ReyhaneMasumi/mapbox-gl-draw-scale-rotate-mode#readme

how to check vue components in browser without using VUE-Router library

I am Using vue 3 with CLI Build tool. Going to import my component on .net page.
I need to check my components on browser without using a router library. Actually it was stand alone components
Is there any way. In Vue 2 i have used gulp build tool and fractal tools for checking my components in broswer. After migrate to vue-3, i can't find solutions for that.
If you route the page with Java or .Net, Just create a route page with .Net and import the component into your new page. Hope this will work
if you just need to test a component and your vuejs project is starting rely on jsp or .net. just make a new route and import the component into the route page you make. you could see the way in vuejs.org quick start part. https://vuejs.org/guide/quick-start.html#without-build-tools[enter image description here]1

Is it possible to use js resources on Node.js or react Native?

https://github.com/vimeo/player.js/
Is it possible to use this api, player and methods, in a node.js or react native app?
Sorry for the basic question, but I'm a SQL / Web developer, and I need to know about the mobile app part to think about the backend part.
You should use the module at the address you are linked to if you are running the function through a webview, or you should use the React-native module to resolve this through the React-native.
This link is a 'vimeo' module used by the React-native.

Can a website work with both simple JavaScript and React

I have a design of the website which contains javascript without any framework. Now I'm in the development process and I need to use javascript framework like react for a specific process. so, will it work or I need to transform everything into a framework? I'm working with Laravel and how can I make multiple react app for a single website inside Laravel framework?
Yes. This is exactly the problem that Facebook aimed to solve by creating React. They initially only used React for parts of the comment system and their chat.
You can create a React component and use it in only part of your website. You just need to provide it a place for it to mount. That is, a div where you are mounting your application.
Check the documentation for React DOM and the integration guide for more information about rendering to the DOM. The basic idea is to create your component then use the following code to render it:
ReactDOM.render(element, container[, callback])
From the React docs:
React can be used in any web application. It can be embedded in other applications and, with a little care, other applications can be embedded in React.
To integrate React with other libraries or frameworks, check out the React integration guide: https://reactjs.org/docs/integrating-with-other-libraries.html
Yes you can create global window renderer functions from react library and call it from vanilla js or some other third party library like jquery .You just need to include the minified js to call that function.
Some thing like below on react
const app = (parameter1,parameter2) => (
<YourComponent parameter1={parameter1} parameter2={parameter2}/>
);
window.renderYourComponent = function (p1, p2) {
render(app(p1,p2), document.getElementById('your_div'));
}
On your vanilla js
<script type="text/javascript" src="your_minified_react.js"></script>
<div id='your_div'></div>
window.renderYourComponent("p1","p2");
Everything will be rendered inside 'your_div' and you can work separately on react
Yes, You can make multiple React apps for a single website inside the Laravel framework.
The Laravel often uses a blade template for frontend UI.
What you need to do is build the React app and integrate the built React app with the Laravel blade.
You can copy the whole built contents of the React app into the Laravel home blade, for example.
In addition, inside React to import custom Javascript files, you can use several ways like script tags and also webpack copy module.

WebStorm AngularJS, Angular CLI, React Native & React App

I couldn't find an answer to this... so, when I open a new project in WebStorm I have the 4 options (and many more) mentioned above - AngularJS, Angular CLI, React Native & React App. I have found out that Angular CLI is corresponding to Angular 2.
My question is: which of the 4 or maybe another option I did not mention here is corresponding to Angular 4 which is the newer version of Angular 2 as I understand it.
Also, if someone can please help me understand better the difference between the 4 options I have mentioned: which should I use and for what purpose? For example if I want to build a minesweeper game, which of the three would you choose?
Also, in my search I've found that React Native is for mobile use (apps) so what is the difference between that and React App? And is any of these are suitable for creating a game in PC browser (and not on mobile)?
1.'Angular CLI' option allows creating Angular 4 project using Angular CLI
'AngularJS' option just clones https://github.com/angular/angular-seed - a project stub for Angular 1 application
'React Native' creates a React Native project stub using react native cli
'React App' creates a React project stub with create-react-app
React itself is a JavaScript library; React Native allows creating mobile applications using React library + native components. If you like to create a web game to be run in browser, you don't need react Native. You can use React, or Angular.x, or any other JavaScript framework that supports creating custom UI components

Categories

Resources