Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 3 years ago.
Improve this question
Backstory: My boss has given me the mission to figure out how to implement react into one of our existing codebases. The idea is to use this to test integration and see if we can slowly migrate out projects over to react. As well to demonstrate to those in charge improvement react can offer over jquery. The problem is I only have less than 2 years of web experience most of which is jquery and near zero of that is react. So I'm struggling to learn the process of integrating react. This is made more challenging by figuring out supporting systems like webpack, npm, and varies libs used with react.
Goal-1: Get a single page running react inside an existing layout that can support modules/libs
Goal-2: Get this page to play well with our jquery menu (option as I can rewrite it)
Goal-3: Get everything placed into its respective folders inside our src/main/webapp
Current state: I have a page loading react and babel using simple script tags. This works but is rather difficult getting any other react libs to load. As most assume npm is being used or commonjs at the minimal. Neither of these I have much knowledge with using/implementing.
What I need: Some guidance on how to implement react into an existing project. I've run over a few articles talking about the process but many lack details needed to understand what is going on in each step. For example getting webpack to export into the target directory so it can be bundled for use in tomcat.
Before this ends up closed, my high level thoughts is get your spring project into a state where it is exposing RESTful endpoints for getting and saving your data. Then build the react project separately from the current java or jquery projects, and have the react ui consume those REST apis.
Apart from that, this is a very broad question you are asking, with lots of ways to solve it, the above mentioned is only a starting point. I couldnt possibly go into complete architecture here..
Related
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 3 years ago.
Improve this question
I've been coding React for the last couple of months now. I thought, initially, just going through the React official docs would be sufficient. But I've had to learn some other tools in order to really make my apps useful/easier to developer. For example, tools like Redux and react-router. How come these tools don't already come with React officially? What's the true purpose of React vs other JS frameworks?
ReactJs is not a framework ,it's a JavaScript library and it's not a language ,it's build upon JavaScript . It's a way to solve your common problems and complex tasks easy to do.
Angularjs/Angular is a fully fledged framework - it gives you built-in solutions for promises ($q), ajax calls ($http), routing and intra-component communication via services amongst others.
Reactjs on the other hand is much less opinionated. It provides a mechanism to layout and structure view code and practically nothing else (from the list above). So it's much lighter weight and you are much freer to use other libraries/packages where you feel it is necessary.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 5 years ago.
Improve this question
I have worked in Angular js and find it to be developer friendly and ease of use is awesome. I found out it performs extremely good with SPA(Single page application) architecture and if controller scope variables are not misused.
I however don't know why most of eCommerce companies complaining angular being not performing equivalent to reactjs. I think in lot of use cases might not event found the visible performance difference, with development effort being less.
Angular followed MVC ideology, while React is developed with MVVM design. I don't consider myself a very good programmer in either of them, anyways I have started learning reactjs, so I want to know should I go for react js for my own project or not, one clear advantage is isomorphic rendering.
I tried to make this a comment but ran out of space :)
As with anything, it is as fast as the developer can make it :) A good AngularJS developer can make an app that is faster than a bad developer creating a React app.
Having said that, React will be faster out of the box with a LARGE amount of elements on screen. AngularJS will require some knowledge to make it fast with lots of on screen elements. But I fully expect for most people they won't ever see any performance drop with most apps. E.g. if you want to make a fairly complex application with a couple of hundred dynamic objects on screen you shouldn't see many performance problems.
If you do choose AngularJS [my preferred framework] I would suggest following the latest component guidelines as it will help you build a performant application.
As an indicator I am working on an asset tracking AngularJS app. We can track around 2000 elements on screen a map at once with lots of additional information and this works pretty fast. It took a lot of work to get there though. It also works great on mobile too :)
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 5 years ago.
Improve this question
I would like to understand how to conduct an independent evaluation of available popular JS front-end frameworks (React/Redux, Vue, Angular and others) for use in a new app we are trying to build ground up.
Many references online end up with conclusions and rates one framework over another. However, I find it difficult to relate with. Say, one report says learning curve for Vue is simpler than JSX for React. I don't find that argument very meaningful since it depends on one's exposure and idea of modularizing a UI component.
So, this SO question is raised to get receive a mixed bag of evaluation suggestions/strategies/schemes to conduct an independent inquiry into these available and popular frameworks.
What themes and approaches can I consider to evaluate popularly available front-end frameworks ?
Please advise.
This answer is given by jeremy-d and copy paste his answer because i
love react and i found react more interesting to work. It's be 1 year
in react and the react community is also very active.
https://stackoverflow.com/users/856942/jeremy-d
Advantages of using React:
easy to know how a component is rendered, you just look at the render function.
JSX makes it easy to read the code of your components. It is also really easy to see the layout, or how components are plugged/combined with each other.
you can render React on the server-side.
it is easy to test, and you can also integrate some tools like jest.
it ensures readability and makes maintainability easier.
you can use React with any framework (Backbone.js, Angular.js) as it is only a view layer.
What is not so good about React?
it is only a view layer, you have still to plug your code for Ajax requests, events and so on. Some people get surprised by that.
the library itself is pretty large.
the learning curve can be steep.
If react-native is really how it was described, react is going to become even bigger.
Performance wise, it is really good as it relies on a virtual-dom to know what is really changing in your UI and will re-render only what has really changed. It does have trouble with very large, slightly changing, lists of children (2000 <li> test), but can be optimized simply.
If you are not sure, just think about the big projects using React:
instagram, hipchat, facebook chat and so on.
Some resources:
React for the stupid people
Rebuilding Hipchat with React
Why React?
And probably one of my favorite blog post Why React is awesome?
The community behind a framework is one of the most important factors for me. I want to be able to find answers on Stack Overflow for my questions, and I want to be able to find libraries and packages I can use that are actively maintained.
I like React most of all because it is easy to integrate into some other backend framework e.g. Rails.
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 5 years ago.
Improve this question
I'm trying out some modern Javascript frameworks like Angular, React, Vue and Ember, and they all want me to use build tools like npm, grunt, gulp, maven, etc.
Web-programming used to be fun. Just change some files, refresh the browser and see if it works. Now every time I change something, I have to build it again, which takes quite some time. I really hate to see that web-programming has become like this. I know the building can even be done automatically with these tools watching for file-changes, etc., but still, it just sucks.
My question is, when I want to use one of the mentioned frameworks, am I supposed to use the build-tools every time I want to run, or do I just need these for deployment and testing purposes (or not at all) ?
You don't have to use these tools. They're mostly aimed at people who want to use frameworks in larger projects, and have features that let you compile hundreds of JS components into one file. I personally use them mostly for automating build tests, unit tests, and bundling all the assets together on release days. Let's address the frameworks you mentioned one at a time:
React: React provides an already compiled version of their code on their getting started page
AngularJS: Same as react, there's just a file you can include, just look up "angular cdn"
Vue: They also have a file that you can just include.
Ember: See above
For most frameworks, you can just look up "name of framework CDN" to get an online hosted js file that you can quickly throw in to your projects for web development the old way.
Some libraries require building the code, some don't. From the list that you had, none of them require it technically. They can all work by simply including the js file in a <script> tag. However, there are many frameworks/libraries (such as sass or coffeescript) which do require a build tool, because the source code must be compiled to become html/javascript/css as understood by the browser.
Also, there's not really any reason to be so against using build tools. As you said, they can run automatically on file change, so they're really just in the background.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 7 years ago.
Improve this question
I'm building a website that will have facebook-ish features (friends and what not) along with a marketplace and some forums. I've decided to use bootstrap as I'm not a good designer and rather than using Jquery I've come across a replacement for their plugins written in angular (UI bootstrap is the name).
Should I just have one giant angular file for my entire website, aka the plugins for UI one and add whatever else I need to do that, or should I load in two different files? One will be the pre-written plugins and the other one will be the web app needed for that page (for example having the marketplace web app in its own file and include both of them on the same page).
This is my first website so I'm trying to make it as efficient as possible, thanks for the input!
I'd do one for the scripts that you wrote and another for the vendor scripts.
But if you are starting new to gulp or grunt you should really consider using a scaffolding tool such as yeoman. If you use angular-fullstack generator you will see some good examples for both angular and grunt, as well as node.
Definitely not, you should only have one angular component per file. Working with a scaffolding tool such as Yeoman or Slush will make this much easier.
Additionally, I would recommend reading some of the AngularJS styleguides out there. John Papa's guide and Todd Motto's guide are good places to start. Here's a full list of AngularJS resources to get you started. Good luck!