mosessoh PURCHASED
bought the template 2 days ago, it's a really well-done template.

shoutout to the team for really great responsiveness - tbh i was a little wary after reading the comments, but the team has replied to all of my emails within an hour, and their responses are very helpful.

only downside is the lack of documentation for rubix charts, but their source code is not too difficult to go through.

I'm wondering what the status of the update is? I'm also curious about the backend starter that was talked about.

Hi ninjs,

We have finished re-writing the bootstrap core to ensure it works properly with React 0.13.3 and are currently documenting the changes. We might either ship this with Ruby on Rails support as Rubix 3.0 or push this update first as Rubix 2.4 and then push a separate version with Ruby on Rails depending on the changes required now that we rewrote the core. We are planning to release the backend integrations as minor versions starting with Ruby on Rails, then PHP and then the rest.

Hope this helps :)
Please create an Meteor Seed or full Meteor App!
Hi jkolade,

Yes we already have Meteor on our list of integrations for Rubix 3.x. :)
I liked your template very much. Especially thanks for the design - it's modern and eye-catching.

Just one short question. Why do all jsx elements (classes in the code) render Sidebar, Header and Footer, which remain the same, instead of just rendering Body?
Hi modus,

We wanted to provide some flexibility in adding/removing Header/Footer/Sidebar depending on the page you are in. For instance, the Homepage doesn't need the Header/Footer/Sidebar. However you can always wrap the common components into another component and just pass the Body as a child. In fact, since we still haven't shipped the next version yet (currently writing the documentation as we the upgrade includes native integration with Ruby on Rails) we can take your suggestion and include one ourselves. Thanks for the feedback :)
thienpow PURCHASED
hi after i did:

gulp --rtl --production --name demo

i can't launch it with:
nodejs launch.js
thienpow PURCHASED
how to launch it with nodejs on ubuntu 14.04?
thienpow PURCHASED
ok found the solution from your previous answers

below command can work on Ubuntu 14.04:
sudo NODE_ENV=production APP=demo PORT=3000 nodejs launch.js
thienpow PURCHASED
if want to use forever-service, can do:

sudo forever-service install demo --script launch.js -e " NODE_ENV=production APP=demo PORT=3000"
Yes you can do that. You can even use pm2 for monitoring your node process. We use this script to manage our Rubix server:

"apps" : [{
"name" : "rubix",
"script" : "/path/to/rubix/launch.js",
"cwd" : "/path/to/rubix/",
"exec_mode" : "fork_mode",
"env": {
"NODE_ENV": "production",
"RTL": true,
"PORT": 80,
"APP": "demo"

save it as processes.json and do:

$ npm install -g pm2
$ pm2 start processes.json

I am interested in purchasing one of your awesome themes, but I have a few questions; Does this theme have a working e mail? And once i purchase it, am I allowed to customize it to fit my requirements? specially the theme name.
Hi samuelobure,

Can you explain what do you mean by "working e mail" ? You can customise the theme to fit your requirements. Just note that this is a ReactJS only theme.
it seems Modals are not triggering from dropdown menus. Can you provide a pointer as to how?

Example with button that works:
<Button outlined bsStyle='primary' onClick={ModalManager.create.bind(this, this.getModal())} onTouchEnd={ModalManager.create.bind(this, this.getModal())}>Launch basic demo</Button>

I'd like to make that function within a dropdown menu when clicked
<MenuItem href='#' onClick={ModalManager.create.bind(this, this.getModal())} >Check Device Status</MenuItem>

But this doesn't work.. Thanks!
An update, it works when I don't use the onClick event and use something else. Seems I just can't apply a different onClick handler to the component. I'm pretty new to React so maybe i'm missing something easier than defining a custom version of that component that doesn't consume the onClick event. the callback function for onItemSelect seems a good choice but i'm not having a ton of luck figuring out how to call the ModalManager.create method from within a the onItemSelect handler.

Anyway, I think you've done some awesome work here! thanks for any help!
Hi jamesperi,

You should be able to call the ModalManager.create from within the onItemSelect handler. You onItemSelect handler should look something like this:

getModal: function() {

onItemSelect: function() {
ModalManager.create(this, this.getModel())
render: function() {

There is another way to do what you want. You can just still define your MenuItem the way you are doing it:

<MenuItem href='#' onClick={ModalManager.create.bind(this, this.getModal())} >Check Device Status</MenuItem>

and define onItemSelect for your Menu component to be something like this:

onItemSelect: function(props) {

This works because we pass by the props of the MenuItem clicked to the onItemSelect callback.

Hope this helps :)
Worked like a charm!!! Rockin dude thanks :)
lifesymb PURCHASED
I purchased your template. I like it, But I have a problem can you please tell me how to get the HTML files. downloaded because right now we are using code ignitor where we need HTML and CSS and PHP files.
So please send us the link for HTML files
Hi lifesymb,

Rubix is a ReactJS only template and not a HTML template. So there are no HTML files to provide. If you need help setting it up with a PHP backend send us an mail to our support email and we'll help you get up and running.
Hello I've just purchased this theme, but I cannot install it...

I've already installed NodeJS from the site. Then in the console I type the comands but when I run "npm install ." a lot of warnings are shown, some deprecated files and network errors. Then I type the "npm install -g gulp" and the "gulp" command and it tells me the error "Cannot find module array-uniq"

Could you please tell me how should I install the theme please?

Another thing is that I was expecting to get the html's from the downloaded packages, now I know it is not possible, but this is a conflioct because I'm currently working with ruby on rails for the backend of the application, how can I use the jsx files for the views of my app?
Hi ozzlopz,

We have replied to your email. Lets continue the discussion there. Thanks.
I would like to use a custom static page for index, without the rubix layout, is it possible?

Or I can use a custom css set only on the index page?

Hi Andrea,

Yes it's possible to have a custom static page for index. Just add your own styles that override the default Rubix styles in src/sass/demo/pages/_homepage.scss file.
I would like to use the startup framework, it uses bootstrap and custom css.
If I put something on _homepage.scss it must override the styles, I think that it can mess up the css.

Maybe I can move all the code on an /app subdirectory and keep the index.html clean?
Ah okay I now get what you mean. Yes you are correct! You can separate the styling of your homepage from the Rubix styling by moving the Rubix app to a subdirectory. Just ensure that the static assets that load for startup framework are only loaded when index.html is rendered and not when Rubix app's index.html renders to prevent conflicting styles.
I added a /public/index.html file and added a custom rule in server.jsx CATCH-ALL ROUTE sections:

if(req.url === '/index.html') return next();

Then removed the default / route on routes.jsx, it seems to work, but I must remove every transitionTo('/') command
I looked through all the comments and got answers to my production questions, my ajax questions. I was also looking for the easiest way to set another color as the default theme color for the example app? In this case, green like in the demo app.

Would you recommend the use of Superagent or another package for loading external JSON data like from another sites API?

Does your team use Karma and Mocha for testing any part of the app? I would love a simple example test as a starting point if you do.

Finally, I would pay for this app again out of courtesy if you were to update the codebase to use Bable and have the JS code written in ES6 (use Class and Import syntax instead of require). I would also love to see a lower dependency on jQuery.

Thanks for the great template.
Hi frequencydesign,

You can create your own theme by using the theme-maker mixin we have provided. See theme.scss for an example (we have provided 6 color schemes by default). As far as data fetching is concerned Superagent is really good. So go ahead! We are including some jest tests in the next version for our core bootstrap components. You can probably extend those to test your own code as well. We have already updated the codebase to use Babel because jsx-loader is less powerful now and the React team itself is moving towards using Babel as default JSX preprocessor. We are currently moving all the demo source to use ES6 classes and import syntax as well. The next version also includes support for ES7 decorators for higher order functions instead of mixins. You can do something like this:

export class Homepage extends React.Component {
handleNavigation() {
setTimeout(() => {
}, 250);
render() {

instead of:

var Homepage = React.createClass({
displayName: 'Homepage',
mixins: [ReactRouter.State, ReactRouter.Navigation],
handleNavigation: function(e) {
setTimeout(function() {
}.bind(this), 250);
render: function() {

We also want to reduce dependency on jQuery. But it'll take a couple of versions more before we can totally remove the dependency (need to port over third-party components to React which takes time).

Hope this helps answer your questions :)
Thanks so much! Great responses!
Can you clarify for me what is the proper command line to start the node app in production mode?

I saw a response on page 3 of the comments, but I want to confirm again because I have a Live server successfully running the "gulp" command, and successfully building a production bundle with the "gulp --production --name app" command, but I have not had any success running the production mode.

$ NODE_ENV=production APP=<app-name> PORT=<port> node launch.js

should do the trick :)
When do you think you'll be releasing the React 0.13.3 version?
I'd like to know that too. 1 month ago I got the answer "this weekend".
I know that unexpected delays happen. But it would be great to get at least a response.

I've bought this template because of the promised update. The current version is not very useful for my use-case.
Hello Team,

We have purchased Rubix - ReactJS Powered Admin Template theme. But we don't see the HTML pages. We have to use few things from the theme. Please let me know how I can extract the HTML pages.

Does it include in MVC project?

For anyone looking, I was able to use pm2 with these command lines to launch a production environment server on DigitalOcean:

First, production build:
gulp --production --name app
Second (after install of pm2):
NODE_ENV=production APP=app PORT=8080 pm2 start launch.js

I used this tutorial for setting up the servers.
Don't forget to setup gulp -g globally. I also used Git to help transfer files rather than FTPing
If you run your app as the Root user, your app may crash. This is also a security risk, but more importantly, running the app as root will cause the app to crash. Create a new user with sudo (super user) rights and run the app that way.
As of the new 3.0.1 version, I believe the new file to run for production mode has changed names. @Sketchpixy, can you confirm?

Now (using pm2 to manage application) the file I had to target to run for production mode looks like it is "server.js" therefore, the new line for the above instructions is:
NODE_ENV=production APP=app PORT=8080 pm2 start server.js
Yes @frequencydesign you are correct. A lot of cloud hosting providers defaulted to looking for server.js file and it made no sense to be calling it launch.js.
Hi, where do I update the default css theme?

For example I have updated:

html.default body #sidebar #avatar {}


But /rubix/public/css/app/raw/ltr/theme.css is overwritten whenever I restart gulp.
Update src/sass/app/theme.scss. It gets overwritten because we use SASS for preprocessing CSS. Don't directly modify CSS files.
Have you noticed that the mailbox/notification tray is invisible on mobile? I don't see any way of finding it, either.
is there any guide on how to upgrade an existant rubix installation with the new release?

We'll be publishing an upgrade guide along with some tutorials in 2 days. The major changes are:

1. Moved to ES6 classes and ES7 decorators (still using React.createClass when including react-router mixins until this is fixed: https://github.com/rackt/react-router/issues/1173).
2. Simplified Tab/Nav/Dropdown components.
3. Updated to React Router v1.0.0-beta3.

Please let me know if you face any issues while trying to upgrade to the latest version.
grbspltt PURCHASED
I really like the updates to 3.0, although I cannot get your demo to load at all in IE. Not sure if that will be the case when I develop my web app using your template, just thought you should know.
Hi grbspltt,

Thanks a lot for this feedback. It's a weird Windows bug that was causing the script to not load at all. Pushing a fix in 15 minutes.
Our team bought your template, last version. We are trying to install some extra node modules, but we are getting an error when we import them on the jsx files (routes folder). Where do we need to import them?

Write a comment

This is a great way to give the seller feedback and ask them questions about their item.

You must sign in to write a comment

Sign in or sign up to make a purchase


Licenses: Details »

Single application $24
  • HTML Template
Bootstrap: Compatible with 3.3.x
  • Responsive
  • Fluid
  • Fixed-width
  • IE 9, 10, 11
  • Latest Chrome
  • Latest Firefox
  • Latest Safari
Uses Less:No
Uses Sass:Yes
Labels: admin, bootstrap, dashboard, graphql, laravel, meteor, rails, reactjs, redux, relay
Released:4 years ago
Updated:2 years ago
Sold exclusively on WrapBootstrap


Signed up 4 years ago

Need a front-end template?

About Bootstrap

Bootstrap is designed to help people of all skill levels – designer or developer, huge nerd or early beginner. Use it as a complete kit or use it to start something more complex.

Unlike other front-end toolkits, Bootstrap was designed first and foremost as a styleguide to document not only its features, but best practices and living, coded examples.

Built to support new HTML5 elements and syntax with progressively enhanced components.

Browser support

Bootstrap is tested and supported in major modern browsers like Chrome, Firefox, and Internet Explorer.

Tested and supported in Chrome, Safari, Firefox, Internet Explorer, and Opera.
  • Latest Chrome
  • Latest Firefox
  • Latest Safari
  • Latest Edge
  • Internet Explorer 10/11
  • Latest Opera

Features & includes

Bootstrap provides an unparalleled array of features and reusable components that let you hit the ground running:

  • Responsive 12-column grid
  • 12 custom, modular jQuery plugins
  • CSS styles for forms, navigation & more
  • Dozens of reusable components
  • Components are scaled according to a range of resolutions and devices
  • Built with Sass (CSS included)
  • Complete styleguide documentation