I found an open source Ruby on Rails project that is created with command rails new myapp --webpack=react but I am only interested in the React part. How can I seperate it from the rest and enable it to run on its own?
The link to repo: https://github.com/vigetlabs/storyboard
For what I have done so far;
React related files reside in directory ./app/javascript/pack/ but npm script triggers Ruby application first. Ruby, somehow, starts the React application. This is how far I could come.
use create-react-app to create a new react app.
copy and paste /app/javascript/src to the newly created react app. maybe packs folder too.
copy over the package.json file content to get all packages.
do some testing/debugging
Related
I'm trying to follow other people who had a similar issue like this one
Electron-Builder include external folder I wish i could be more specific on what my problem is, the reason is that i dont know whats wrong.
I am making a react app which has a server with an sqlite db and im trying to use electron.js to make it into an installable/executable
here is my dummy repo https://github.com/Juan321654/electron_react_with_build_installer_sqlite_db the master branch was just how to make electron work with react, the server branch is the one that i need help with
you can clone and just do npm i, npm run start to launch executable. npm run build to build
the code works fine in development mode and even after i make the build project with electron i can launch the executable and it works fine and it reads the data from the database, but as soon as i take the dist folder out of the project to send to someone or install the software, it stops working and it loads the app, but it does not read the data from the server/db, I am not sure if its missing node modules or the server folder, or maybe if im missing some kind of command in my scripts in the package.json?
I started single-spa app from scratch following:
https://medium.com/#AndrewLocke/creating-a-single-spa-web-application-4e115802f474
I wanted to use angular, so I created another app using
ng new my-app --routing --prefix my-app
and app was working fine, then I've added single-spa-angular by
ng add single-spa-angular
and application stopped rendering, even calling angular.version from console in dev tools returns error: angular is not defined.
How can I render this application? Or have live reloading for development?
This is fine I guess. When you add single-spa-angular the angular.json is changed (check it in git). The application gets a new rendering mode. Just continue with the tutorial and finish configuring the apps.
Also check the package.json file for new scripts. There should be one build and serve script for single-spa and a different ones for standalone use.
I'm used to building ng applications using just Angular and with this typical structure:
app
js
home
home.controller.js
home.directive.js
shared
usedByAll.controller.js
usedByAll.directive.js
templates
home.html
test
e2e
protractor tests
node_modules
index.html
package.json
So that when someone else coming in wants to catch up they just need to run
npm install
to install all the dependencies listed into their node_modules folder saving them time.
But recently I've started working on a Ruby-on-Rails project that is looking to angularize some of its components. This naturally means they're following their own MVC style and project structure and the angular stuff has been restricted to the following folders:
app/assets/javascripts/angular-components/component1
component2
component3
lib/angular.js
angular-mocks.js
etc
This is fine for development but when it comes down to testing I think this could be a problem. So my questions are really the following:
1 - When installing new modules via npm and attempting to save them as devDependencies
npm install karma --save-dev
to the package.json file, doesn't it mean you should have the node_modules folder at the root as well as the package.json file at the root?
2 - Should the karma.conf.js file, like the node_modules folder and package.json file, always be at the absolute root of the application?
Thanks
In many rails/angular applications you can see that Angular is tucked away inside the app/assets/javascripts folder. I personally don't like mixing and matching what I'm using when it comes to pages - i.e. go and get a Rails generated view or this one is an Angular one so go there.
Instead I broke out the two. Essentially the Rails part of this just functions as an API whereas Angular now handles the front end entirely. This allows you to treat the angular part nearly as a standalone app, following the typical angular structure. By doing this you can have the karma.conf.js file at the root of this folder.
ExampleAppName
- app (All Angular stuff is in here)
- src
- gulpfile.js
- karma.conf.js
- package.json
- api (All rails stuff is in here)
- rails stuff
I am building a React app in Rails and would like to try react-redux. I noticed that it doesn't offer a CDN nor a bower package.
The installation instructions recommend using NPM, but this is not a node project. I handle all my current assets through the Rails asset pipeline, a CDN or a bower package (via rails-assets)
Is there a way to install it without using NPM?
Is there a way to get NPM packages to play nice with existing asset pipeline packages?
You can also check out https://github.com/shakacode/react_on_rails. It's integrated with webpack which gives it a nice and familiar javascript flow.
They've also got a live example at http://www.reactrails.com/ and the code for that at https://github.com/shakacode/react-webpack-rails-tutorial.
I found that it is possible using react-rails in conjunction with browserify-rails. This blog article explains it pretty well.
Just run the command yarn add redux react-redux
This will add redux and react-redux to dependency as well as connect react to redux.
I am using rails 6 and it works fine with this.
add ruby related lib via bundle add and js related lib via yarn
I want to make Dart app that has flexible deployment. It can be started as a web server or standalone app in browser as well. My directory structure:
bin
- httpserver.dart
lib
- commonlib.dart
web
- web.html
- web.dart
pubspec.yaml
I wanto start either httpserver.dart providing web's content or web.html directly in Chromium. I have troubles with the lib visibility from bin/httpserver.dart. using the "import 'package:prj/commonlib.dart'" does not work. But from the web.dart is works fine.
Please advice how to share libs among bin's and web's code. Or I should I make structure of dirs somehow different?
Note: there is no packages sub-dir in the bin directory created by pub get. I am using dart sdk 1.7.2.
Thank you, Ladislav.
In the bin directory there should be a packages symlink created automatically but it is not in subdirectories of prj/bin. If the symlink isn't created just create it manually.