There's so much I like about React: new ECMAScript features, declarative program structure, patchy yet sufficient documentation. Okay, the only React-specific thing there is the declarative program structure - automatic view rendering based on the relation between state and props. You can use ESnext wherever you want to set up babel (becoming less and less necessary) and webpack, and lots of projects have good documentation. But my point is, I have drunk the React kool-aid. So far, I've only skimmed over the docs for Vue.js, and if that ends up taking over, I'm fine with that. It seems similar enough to React at first glance.
For many React apps, you will want to communicate with a server through a REST api. At the CTL we primarily use Python and Django for custom web apps, so I'm using django-rest-framework. That's what I mean by "Embedded React Application". As opposed to a single-page JavaScript application like Ember really embraced a few years ago (I'm not sure if that's different now, I haven't looked), I'm making React components that communicate with a surrounding Django application. This is also how we developed Mediathread's Sequence Assignment.
Recently I used a new project I'm developing as an opportunity to try out the new create-react-app utility, which I was skeptical about, but had incorrectly thought that's now the recommended way to work with React applications, so I will just go with the flow. I was annoyed that the commands to start, test, and build my application were all delegated to a react-scripts tool that didn't provide any help, info, or flexibility. I also led myself into a roadblock when trying to develop my React app within Django: Where is bundle.js on the filesystem?
Fortunately, you can
eject
from the create-react-app way, which removes the
react-scripts dependency from your package.json and adds
all the dependencies and configuration files that
react-scripts uses to your project, so you can make
changes more directly. I was really satisfied with this
and was able to start developing in React/Django quickly
after copying the prod webpack config
to webpack.config.dev.js,
making some small changes to remove prod references and
filename hashes, and making an npm run dev command:
"dev": "webpack -d --watch --config config/webpack.config.dev.js",
So now, the workflow I used once for Mediathread becomes more standard as I try it on a new project:
cd djangoapp rm media/djangoapp/bundle.js ln -s ~/public_html/reactapp/build/bundle.js media/djangoapp/bundle.js make runserver
... while webpack builds bundle.js in development mode, watching my files as I edit them. And someday that won't be necessary, maybe. I feel like I've typed this before, but JavaScript engine functionality has caught up with ECMAScript standards. Now what's missing is packages and imports in JavaScript - the focus of endless developments in the last 7 years. Or is that already here in the standards? Maybe I only have parts of the picture.
I would invite you to comment below, but my disqus code was injecting malware. I just removed it instead of bothering to fix it. My email's on the main page here.