I'am using Reactjs for the first time and I want to make my website responsive .
So, Is there a library helps me to get a responsive design ?
thank you.
So this isn't something that React will do for you as building a responsive site is something more along the css that you decide to use.
What I would recommend you adding to your react project is another project like bootstrap which will give you the power to create a responsive website. It also has a lot of other basics that you can use in your project to build upon. Specifically for the responsive overview you will want to check out this link => https://getbootstrap.com/docs/4.0/layout/overview/
Related
ReactJS allows us to create user interfaces. Word Press allows us to build websites, whose buttons, list, color, styles can be customized, with a minimal(to no) knowledge in coding.
I have a web site up and running with ReactJS, where the backend is done in NodeJS and ExpressJS.
But the UI is just a basic one.
I want to build a new site where WordPress handles the UI, like the color, style, size etc of components like Button, Tables, List, headings etc and a person with minimal-to no knowldge in coding should be able to drag and drop or customize the website UI, and the ReactJS should handle all the front-end logic and the backend would be handled by NodeJS and ExpressJS.
Is it possible to do so?? Which frameword or word-press plugin should I use. How can I achieve this.
Good day, Hari.
I can try to help you.
1)Wordpress has now Gutenberg block editor withs use React to create UI logic.
So its very easy to create buttons with colors and style the text in 3 clicks.
At the backend we still have wordpress PHP scripts.
2)Another solution is that Wordpress allow to include your React code to your theme with webpack file
please follow this link to see Demo theme
https://github.com/zgordon/twentytwenty-react/
3)Next solution is Frontify its a framework to connect Wordpress + React
https://frontity.org/
The Let me know if it helps you.
Thanks
I have been using semantic ui for the components and the site turns out very nice on desktop,
but it fairly breaks on mobile.
How can I transform it to be fully responsive
I highly recommend you to read this CSS guide
You can create a fully responsive website via Flex-box.
Looks like there is a responsive add-on for semantic, https://react.semantic-ui.com/addons/responsive/
Take a look through the documentation in the link above. You will still have to make the choice yourself of how to make the UI be responsive, but you have helpers from semantic to help with breakpoints.
Ideally you want to start with the grid being responsive: https://semantic-ui.com/collections/grid.html
I had a same question before After I learn media queries with CSS. You can build your app with any view-port with this.
refer this, for the beginer https://www.w3schools.com/css/css_rwd_mediaqueries.asp
I am trying to build application using ant design library. I have an application with home page and want to use localization so application uses locale from browser and displays accordingly.
I searched ant design supports it but could not find example to see how its implemented.
Any pointer or sample apps showing how its done will be really helpful.
I recently migrated a website to Joomla, the old website used bootstrap and was responsive.
However, when I used the same template on the new website powered by Joomla it isn't responsive at all.
I thought it would be responsive by nature, is there any additional configuration to make to get it responsive ?
Note: I am not a web designer, so simple explanations would be great.
Basically Joomla works out of the box with some old style templates. Although bootstrap is already into the joomla libraries it doesn't mean that it is used.
Fortunately there are many free templates with their own framework that use bootstrap to have a ready to use responsive website.
I feel to suggest the helix framework http://www.joomshaper.com/helix , it is also very easy to use and customise.
Or the new gantry5 http://gantry.org/ but it doesn't use bootstrap
I would suggest to use Gantry 5 framework. It is free, light and easy to use if you are not a developer.
It does support Bootstrap but they are using there own responsive framework.
http://gantry.org
I intend to create a Material design based App for Android and Windows.Generally I use Cordova with Ionic framework for development.
In that combo can I add the css and js file of Angular-material and create an app with Material Design ?
Yes, angular material works with Cordova. I have tried basic application with AngularJS, Angular Material and Cordova. And this combination works. Angular material is still in development. I am facing few performance bottle necks. This may be one aspect need to think for time being.
Ionic Framework doesn't play well along with Angular Material.
But you can use AngularJs + Cordova + AngularMaterial and it will work like a charm.
If you do want a seed to start, you can look to this one:
https://github.com/mario-aleo/cordova-angular-angularMaterial-seed
You should not have any issues using Material Design in the same way that you've been using Ionic with Cordova.
In fact, the Ionic team was directly involved in the creation of Material Design. Check out this video for an overview of Material Design by Max Lynch, the co-creator of Ionic.
https://www.youtube.com/watch?v=2qiyhkQVyxE&list=UUEGUP3TJJfMsEM_1y8iviSQ
I've had some problems with cordova compared to straight mobile chrome. Some element don't align right and I think it has to do with the heavy use of flex. I'm still investigating but I'm pretty sure the version of webview my not support it completely. I know that older android versions won't at all. I'll update this if I know more or if anyone else has input on this post here.
I am using this seed : https://github.com/mario-aleo/cordova-angular-angularMaterial-seed
Overall feeling is really great. I am testing elements of material design in the app. Problems that I can see so far is dialog. It opens kinda laggy a bit.