Is there a way to only install certain components of React Material UI. Especially the AutComplete component?
More than "Installing", what you are looking for seems to be only adding the components you use to your final bundle when your app is built, otherwise known as Treeshaking.
There's a guide in the documentation about this that might help you out.
https://mui.com/material-ui/guides/minimizing-bundle-size/
Related
I'm new to web dev and just jumped from vanilla Javascript to React. There was this nice npm package called scrollReveal.js that easily let you expose elements on scroll, but because in React we don't use document.querySelect anymore, there's no way to use this package. I've seen some workarounds with class components but I was wondering if there are any solutions for functional components. Thanks
I don't know which is best option to share component ReactJs in my particular case, I have two application in NextJs, one is e-commerce and another is a manager portal for this e-commerce.
In first app (e-commerce) I have UI Components (buttons, fields, headings, texts, etc), and I want to use these components in the other project, I been thinkings uncouple UI Components and create a new repo, and this repo sharing to both project.
I don't know if this is right thing to do that?
Can I create this repo (UI) in NextJs for use benefits of them? with NextJs is very easy to use Typescript, EsLint, also NextJs include base template PostCSS, and with nextjs almost hardly need config anything.
What do you recommend?
Can I use Next Js only to create repository of components? is recommend?
You need to create a component library.
Component library using bit
Create react library
Here's an article with your question as the header: https://blog.bitsrc.io/how-to-share-react-components-between-nextjs-projects-c0857bbc1fcb
I just want to include material ui dialogs in my project. I do not want to include other components in my project. So I don't want to install full material ui just to use dialogs. Can anyone help with this?
https://material-ui.com/components/dialogs/
According to the documentation,
Tree-shaking of Material-UI works out of the box in modern frameworks. Material-UI exposes its full API on the top-level #material-ui import.
Which means importing exactly what you're using will not result into the inclusion of other parts of #material-ui/ in your production build.
Note all of their examples import only the bits used in that particular example, so figuring out what your project needs for each case should not be difficult. Besides, whenever you're missing something, you'll get a descriptive error message about it, telling you exactly what you missed.
I have few ideas for my npm packages but I need a little bit of help as I am just starting out. I saw tutorials on youtube and they all write those packages in vanilla JavaScript and I saw few repos on GitHub where the package was made in react.
My goal is to make special components that people can just put in their app and render out and later customize through passing down props. For example:
https://www.npmjs.com/package/react-player
This React Player - which you basically put in your app and pass down props to customize
import React from 'react'
import ReactPlayer from 'react-player/youtube'
<ReactPlayer
url='https://www.youtube.com/watch?v=ysz5S6PUM-U'
playing='true'
controls='true'
/>
Should I make my project in React or vanilla JS in my case? What are the benefits of whatever I choose?
I am a little confused because everyone on YouTube is teaching making it in vanilla JS.
Thank you a lot for helping.
Since you said you want your code consumed like ‘ReactVideoPlayer’ using ‘props’, you are talking about building a reusable React component. For this you by definition need to use React.
You would use Vanilla JS for building a library that could be used in any JavaScript context, in or outside of React.
If I have a react based website, can I transform it to react native easily? Or should I build it as react native from day one?
If I have a react based website, can I transform it to react native
easily? Or should I build it as react native from day one?
No. There is no "magic-converter-thingamabob" you can use. But depending on your existing React code, and your specifications for the native app, you should be able to share some of the code-base between the apps.
The view part will have to be done from scratch. Not only because it’s necessary to replace the HTML elements with React Native components, but also because the components will probably have a very different behaviour on the mobile app (source).
React Native has less of a "write once, run everywhere", and more of a "learn once, write everywhere" philosophy. Here is an article with examples and github repo.
Consider writing your app's UI from scratch as this in line with Facebooks's “learn once, write anywhere” approach (https://facebook.github.io/react/blog/2015/03/26/introducing-react-native.html).