sorry for the potentially obvious setup question but I can't seem to find the answer or am searching for the wrong thing.
I'm new to WordPress and I'm attempting to use the plugin ReactPress to add some React to my website. However I'm getting stuck on setup. The ReactPress instructions in WordPress tell me to:
It seems you don't have any React apps created. Go to /path/to/my/workpress in your command line and enter:
But that path/to/my/workpress doesn't exist. I installed WP-CLI so commands like wp info succeed, but I don't have this folder. I must be missing an installation step - any tips?
Thanks!
I'm building my first semi-major MERN app with Redux, without a tutorial. It's really challenging, but a ton of fun.
The project I am building is, essentially, a simple re-engineering of Zillow's API (they have a few, I'm after the more basic of the property search results).
I am using the zillow npm module and want to add what appears to be a pretty popular autocomplete Search plug-in.
My big challenge this week has been diving into the build tools. I read thru the webpack docs over the last couple days, then felt solid enough to try building out my Search functionality, which will return results and a map eventually.
It should be noted, I'm using a scaffolding tool developed by a guy who publishes a lot of good React tutorials (from which I basically learned ReactJS -- it's called turbo360). Right now, I am using webpack 4. I just did a fresh git commit: https://github.com/ScorpIan555/real-estate-app/blob/master/webpack.config.js
I have, so far, read a bit of the Babel docs. I piped in .js extentions to the .jsx test for the babel-loader, thinking perhaps that would get it?
What I'm a bit confused by is that it seems to be tripping over a file written in ES5 (from the geocoder npm module I am trying to use). So, I'm wondering if I should be configuring my babel-loader to not try to transpile ES5 modules or what.
This is the module I am trying to utilize, it looks fairly popular and has a recent commit. I also looked at its webpack.config.js file and tried to apply that to mine...
https://github.com/abec/react-autosuggest-geocoder/blob/master/webpack.config.js
I am closing this as I received assistance on a Slack channel. This plugin uses experimental code which I do not wish to use on my app. I will use another plug-in. I was looking for help with my webpack.config and am reliably told it is fine. Thanks to all who viewed this question!
I am using the React Redux Starter Kit from DaveZuko, and am stuck on how to create production server to serve the compile client side code.Ideally I would just like to use the Koa server and move it to production, but can't find out how to do that.
All relevant code is unchanged from the repository here: https://github.com/davezuko/react-redux-starter-kit
Does anybody know how to compile a product server for this?
I did try to use davezuko's starter kit, but it was really hard to follow what those configuration files really did and messed them up when trying to install packages that were missing.
I also tried facebook's create-react-app, but that was really complex too when you run the eject command, so I gave up and created my own starter kit http://redux-minimal.js.org/ . I has the minimum amount of packages that lets you build rich real-word apps, but doesn't have the cluttered configuration boilerplate that other starter kits have.
Now, answering your question, with redux minimal, you just do "npm run build-prod" and it compiles the css and js files for the production environment, minified and ready to go. Then you just copy the public folder which contains the html file too, paste to what ever server you want, and then call the index.html url and it works.
I am having a hard time integrating deployd into an already existing angular grunt workflow.
Did somebody ever accomplish to do this easily.
Steps taken so far:
added deployd and grunt-deployd to the proji
adjusted the gruntfile in x many ways
project has a public folder where the angularjs resides.
and the rest is the usual dpd create stuff
now dpd -d gets me to the dashboard but it collides with the grunt modules of the existing project mainly grunt-concurrent and instantly crashes dpd
if I run the proji with grunt server it does load the dashboard on port 7777 but its blank so one can not do anything the dashboard usually offers.
It further does not proxy the api endpoints properly to port 9000 it fails with cannot get.
I have seen projects on git trying to do the same but almost all of them are broken.
https://github.com/taras/grunt-deployd/issues/1
Like this guy that switched away from deployd.
I think its a pity as deployd is such a great thing. My friend said as well if the integration would be easier in situations where you do not want to do stuff with dpd-client and the dashboard white instead of black much more people would love to use it!
I would like to post my gruntfile but wanted to see first if thats useful at all.
Update:
Deployd has been updated to be able to integrate Grunt, Gulp or other dev tools with Deployd.
The documentation page for this feature is available here:
http://docs.deployd.com/docs/server/use-grunt-or-gulp.html
tldr: you just need to add a package.json with deployd in the dependencies and gulp/grunt in your devDependencies.
Old answer: Running deployd with Grunt, Gulp or any other Nodejs module is a known issue.
I proposed a pull request that fixes the problem, but more tests are needed to be accepted.
Temporarily, I use the fork of the pull request and add this repo in my package.json (here's a working example):
"dependencies": {
"deployd": "nicolasritouet/deployd"
}
I am trying to figure out a simple way to run tests on angularjs application.
I am new to the testing world, so it's a little hard to understand all the options and the difference between them.
My goal: to be able to run the tests simply from within my IDE - Eclipse.
And to tests the code on google chrome browser.
I found jasmine to be the obvious choice for writing js unit tests. The problem is choosing a runner both for the jasmine tests and for e2e tests.
Trying to keep it simple, I've come up with the following idea for a setup:
Write the unit tests in jasmine, and the e2e tests in phantomjs and syn.js.
Then configure eclipse to run phantomjs as an external tool, so that the output will go to the console in eclipse.
I also plan to have a CI job in Jenkins, and to my understanding Jenkins can also run phantom, so theoretically this solution will work the same for CI.
Alternatively, there are test running tools like Karma and Protractor. On one hand, they seem to be recommended, but on the other hand they seem to me like overkill in some cases. They require a lot of different tools/services/processes to be running in order to work, and it seems like a pain maintain all that setup if it breaks.
To my understanding: protractor runs on webdriverjs which runs on nodejs, and it requires a selenium server to be running in the background, and on top of all that the selenium opens real browser windows which seems a little pointless as opposed to headless browser testing.
Then there is Karma, that I did not yet fully understand what it's supposed to do. From what I've read it monitors the files in my project and whenever a file is changed it runs the tests. I'm not sure how it runs the tests - is it also using selenium?
And lastly, there are grunt and yeoman, which I did not understand at all what they do and how they interact or fit together with the other tools I've listed.
I would appreciate if someone could clarify what these different tools do, and how they fit together. Also, how would they fit with Jenkins as a CI server?
Also if you could comment on my "simpler setup" - does it make sense? Am I missing something?
Karma is for unit testing your JS, regardless of whether it is using Angular or not. The ins and outs of unit testing with Karma are covered very well here: http://www.yearofmoo.com/2013/01/full-spectrum-testing-with-angularjs-and-karma.html. Yes, Karma opens and closes browser windows as needed and specified in the configuration file. If you don't want any browser windows opened, you can use PhantomJS. You can run Karma from within most any IDE that is capable of running an external script, or run it via the command line.
Protractor is for end-to-end (or E2E) testing of your project as a whole. It will open a browser window and click through the pages as though it were a user, entering data where you tell it to and looking for the specified results. Protractor is a bit more complicated than just writing some Jasmine, but the results are worth it. Like Karma, you can run Protractor from within most any IDE that is capable of running external scripts or via the command line.
Yeoman is a process management system that incorporates dependency management via Bower, task automation via Grunt, and project management via Yo. It will run your tests in Karma and Protractor, minify your JS, CSS, and HTML, compile everything into appropriate files (internal JS, external libraries, and CSS) and provide you with a complete package that can be deployed. The beauty of Yeoman is that it is not specific to any one IDE. Everything it does can be done by scripting in your IDE or via the command line.
Now, having said all of this about Yeoman, you do still have to write the tests (it won't magically come up with them for you) and learn to integrate it into your development routine, but it is definitely the way to go for JS development. Eclipse is fine for JS development, but you'll get better performance and ease of use (IMHO) from WebStorm.
As for how these all fit into CI like Jenkins, I believe that both Karma and Protractor output test results in a format that Jenkins can read and display. With the scripting possibilities in Jenkins you can configure it to run the build process each time your source control repository (you are using some sort of source control, aren't you?) changes and show those results on the Jenkins page. My office has a very similar setup and we use it daily. I'm not the guy that has to do the Jenkins configuration, but I do work with Yeoman (and thus Karma and Protractor) via WebStorm on a regular basis and have had very good results.
I would say the clear choice here is Karma and Protractor. While it is true that they rely on a bunch of other stuff, they do so pretty antiseptically: protractor starts up the selenium server and then shuts it off when it's done. Once you have node installed, the other installations are all super simple. I would also install httpster, which will serve up your public director on port 3333.
Frankly, having come from a decade of doing TDD in the Java world, when I first looked at Javascript a few years ago (again), the testing picture was a complete joke. But now, I think the combination of Karma and Protractor is pretty fantastic. Inside IntelliJ, you can run the Karma tests and they are stupid fast and the results are presented in a runner that's as good as anything I've seen in the Java world (Xcode 5 has the best test integration). You can also install the ddescribe plugin in IntelliJ and have a ui for running individual tests or excluding tests.
On the protractor side, I found this post because I am at the point now where I am going to run my karma, protractor and then JUnit tests on a continuous integration server (either Jenkins or TeamCity). I was kind of surprised at the paucity of info on that leg of the trip, but the clear direction I see there is Grunt, because it will run your protractor tests then generate the JUnit-style output Jenkins wants. Grunt is also a pretty impressive addition to the JS world.
I know this sounds like a bunch of opinions, but I think that as happened in the Java world, the Javascript world has now reached that level of maturity where you are just going to have to expect things to drag other things in with them. Frankly, looks like node and npm do a pretty nice job of making that pretty seamless (vs. a decade down the drain on Maven in the Java world).
Updated: Sorry I did not read your question properly.
karma is a test runner, which is best suited for jasmine. For setting up is very very easy. Please download node, and install npm install karma. Follow the angular seed sandbox project it contains all the basic config set up for unit testing and end to end testing (in config folder).all you need is nodejs plugin installed in eclipse
Yeoman can be used for javascript minification, sass compilation e.t.c.
Install node eclipse and you can set all up in eclipse.
http://www.nodeclipse.org/