Inferno.js and React Semantic UI Toolkit Compatibility - reactjs

I'm working through a tutorial today, but trying to substitute Inferno since it will be good practice if we go with Inferno for a new web app I'm building (since I'm not allowed to use React - it's complicated).
In the tut, I was introduced to the React Semantic UI toolkit, which looks pretty useful, but it has peer dependencies to React and react-dom.
So my general question/issue is "how can I (or is it possible) to resolve these types of things that won't build because it says react is required?"

Related

Can I use PreactJS with React Native using preact-compat (Or using any other method)?

I've been working with react and react native for a while and there's a library that caught my attention: Preact. I learned it (that being a react developer was not difficult), I did some PWA's to practice (Copying medium-sized projects that I've done in the past) and, if you know what Preact is, it goes without saying my impression. It seems incredible to me. My question is: is there a way to work with react native using Preact? Maybe with preact-compat?
Not out of the box, no. See this discussion from GitHub
The short answer is: use a native wrapper that exposes DOM.
The long answer is that there are woefully few options for this. Some time ago, I had begun building a DOM interface to React Native, but I have no experience with React Native whatsoever and I'm likely not the best person to do that implementation.
I do know that folks have used Preact with NativeScript and had some success: NativeScript doesn't expose a Web-compatible DOM, but its UI primitives are still quite easily mapped to DOM primitives:
https://github.com/staydecent/nativescript-preact
https://github.com/NathanaelA/nativescript-dom/blob/master/src/dom.js
It would also be relatively easy to implement a nativescript-preact using the source of nativescript-vue, which implements a simple DOM on top of NativeScript's UI components that Vue then renders to:
https://github.com/nativescript-vue/nativescript-vue/tree/master/platform/nativescript
It's also worth noting that preact-compat is the legacy package, used for Preact 8.x and prior. preact/compat is where you'd get compat going forward.

Develop a Grafana plugin with react without using typescript

I am going to develop a custom plugin for Grafana. As far as I know, it must be developed using React and Typescript. I am going to use deck.gl in the plugin but deck.gl do not support Typescript at the moment. Although there are some unofficial packages to do so, I have faced some difficulties to use them (they are not update and the not support all types).
So, I am relatively new to JS and typescript. I would like to know is there any way to develop a Grafana plugin without using typescript (using pure React instead)?
As far as I search, it is possible to do so but it is not reasonable (nobody has suggested that). My biggest problem with typescript is using libraries without type definitions. I tried to ignore definitions and config typescript to ignore these types, and it solved my problem (it was a tricky one!).

Is React With TypeScript Still Worth While Now That React With Hooks Has Arrived?

The team and I are embarking on a React project. We are primarily a Microsoft team who are all experienced with .Net for decades!
We have been really impressed with React and feel like we are going down that route. We have done all the Angular vs Vue vs other options to death.
As we are all C# developers we are planning to use React with TypeScript. Mainly for two reasons
We are used to a strongly typed code bases coming from C#, so we have been more successful with the React with TypeScript.
The code base has the potential to become quite large and we plan on sharing React components and TypeScript interfaces between teams/projects via an internal NPM registry. We think TypeScript will highlight typing issues early especially when refactoring and allow sharing more effectively.
I have talked with another similar sized team who did not start out with TypeScript (or Flow) they ran into refactoring problems when their solution got large and retrofitted in TypeScript.
I would like to start out with TypeScript from day one as a result
However, I am getting some push back from the more Javascript orientated developers. Who say:
TypeScript not required in modern ES6 JavaScript applications
The wider React community does not use TypeScript
Hooks which are new to React compound the points above
Have I wandered into a religious argument rather than a technical one (static typing vs dynamic) or are there points justified?
Happy to admit I am a JavaScript novice compared to my C# experience so I could be totally missing the point.
I thought I would pose the question to the community and find out some educated opinions. Please be kind
TypeScript not required in modern ES6 JavaScript applications
It depends on what the requirements are. You say you anticipate refactoring, I have some experience with refactoring my own javascript and TypeScript projects. I can say that without TypeScript, refactoring takes more effort - you have to look at the implementation code a lot, just to be able to understand what the interface is. This can be alleviated by extensive amount of API documentation and unit tests, but - how many projects out there have those, and how many projects maintain the API doc so that it matches 100% with the actual code? Type annotations are a nice way to express what the expectations in the code are, and have a side benefit to be maintained together with the code.
The wider React community does not use TypeScript
Everyone uses what's best for their needs. In reality, there is no "community", there's just a bunch of people working on different projects. What's suitable for a majority of people might not be the best for you.
Hooks which are new to React compound the points above
The recent version of typings for React does seem to support hooks. The result of google search for "react hooks with typescript" shows that a lot of people are using React hooks with TypeScript. I'm not aware of any specific problems, but if there are any, there's a chance they will be sorted out, eventually.

Can I use non react npm packages in react?

This is a newbie question that I have not found an answer to on the net. I would like to use this package in a react app. https://www.npmjs.com/package/zipcodes
I have only used react packages so far.
Yes, you can. Same way like with no-react. React community have a lot of plugins, made for react specially, but you have no limits to use any kind of library. Most of them are compatible or require wrapper creation, which will use library with it's imperative usage, but inside react component.

VueJs 2 with Vuex vs React with Redux

I've spent the past few days looking at VueJs 2 with Vuex and i really like it.
Having only had a brief introduction to React, I've found vue js 2 has been easier to pick up.
React seems to be growing in popularity, but I can't see the benefits of React over Vue 2.
Both are component based frameworks with routing and state management tools.
So can someone explain which are the main differences between those frameworks?
This is an opinionated and subjective question. And it often starts holy-wars than really answering anything and thus it is not really suitable for StackOverflow. However, I will try to answer this in an objective manner as possible. (Note: I am purely comparing Vue with React and deliberately avoiding Vuex vs Redux)
Why Vue.js?
It is designed to be an approachable framework. It is suitable for beginners and advanced users alike. When you are starting with Vue.js, it is as simple as adding a script tag to your page. For the advanced developer, the possibilities are endless. You can start with any sophisticated build tools - TypeScript, Babel, Webpack, etc.
Vue.js is developed much after Angular and React. It has learned from both and managed to pick many best things from them into Vue. For a beginner, Angular's idea of components, services, dependency injection, bootstrapping application, etc can feel overwhelming. Same is applicable to React; JSX can feel odd (Even after years, I still find it weird.). Now, Vue.js is a cross-path. You can use angular like templates or you have the freedom to choose React like JSX.
Vue.js reactivity is very well abstracted. With Angular (digest cycle in v1 and zones in v2) or React, it is bit different. It takes time to learn these concepts.
There are tons of other reasons why Vue.js should be your choice. Sometime back, I had written an article explaining why Vue.js:
https://blog.webf.zone/vue-js-answering-the-why-after-15-months-62db797f75cc
Why React?
React is a pioneering library (It is not a framework) just like Angular. It introduced the ideas of uni-directional architecture, virtual-dom, components (stateful and stateless), etc.
React Native is another reason why you may want to consider React. It allows you to take the same code that you wrote for Web and build native mobile applications. Now solutions do exist in the Vue.js world. But definitely not as mature as React Native.
Functional programming: No way React is a library based on functional programming. But doing React right way means you need to use immutability, explicit state management and all these allied concepts stemming from functional world.
Redux: Redux is the darling of React world. It has unlocked wonderful architectural patterns for front-end world like time-travel debugging, explicit side-effects, functional components, etc.
Innovation: React has some crazy ideas like Relay, Next.js (Vue.js has Nuxt.js). I also heard about some Drap-n-drop editor for React; first class TypeScript and Flow support (You just cannot get TypeScript + Vue.js + JSX working together even in 2018).
Why not React?
Using only React is not enough. Very soon, you will end up with using Redux, Redux middleware, Immutable.js, etc. Doing all of that at once can be intimidating.
Redux. It is wonderful but it is verbose.
Most important: Using React without any sophisticated build system is cumbersome. To do anything serious, you will need Babel, Webpack, etc.
Again, which one is better?
There is no better solution. I will choose Vue.js if I need to accommodate a vast array of developers (beginners-advanced). I will choose React if my team is versed with all the extra overload that comes with React and team loves everything JavaScript approach to web development (Even CSS is JS).
Finally, there is one another angle to it. Programming in React needs discipline and hence, there is a good chance that you will find it easier to bring homogeneity to your codebase. With Vue.js, there is often more than one solution to a problem. That makes it good and bad at the same time.
You will not go wrong with either of them.

Resources