Edit on GitHub


You Ask, We Answer: #

1. Is Electrode really being used to power walmart.com? #

In less than one year, Walmart.com has completed its migration to React/Node.js and we are proud of that accomplishment! The goal was to build a new application platform to help @WalmartLabs and its engineers scale for the future.

As part of that migration Electrode served as the platform for enabling the fast paced transformation. Now we have open sourced release of Electrode, the application platform powering Walmart.com.

2. What are archetypes? #

Electrode archetypes are a way for every electrode module to share common scripts, dependencies and best practices that can be updated in real time, and have that update propagate to every module that inherits from that specific archetype.
Please refer to what are archetypes? for a detailed description of archetypes.

3. Why is my server throwing error "cannot find module ..." on start up? #

Most likely you are using npm@2. Upgrade to npm@3 by running command npm i -g npm@3 and redo npm i.

4. What is the difference between creating a new electrode app using yo electrode vs cloning/forking Electrode Boilerplate? #

Electrode Boilerplate was created using yo electrode command. yo electrode gives you a bare bones Electrode Isomorphic Universal React App with NodeJS backend.

Electrode Boilerplate includes all the bells and whistles for the SSR optimizations using the following modules configured and integrated for your use:

Head over to this amazing blog written by Alex Grigoryan about How Electrode improved Server Render performance by 70% using the stand alone modules listed above.

5. What do you mean by reusable electrode components? #

Electrode reusable components are for reusing across different apps, so they are made for being developed independently, consumed via electrode-explorer. These reusable components can take extra disk space to be able to develop & run independently in the browser, but when bundled/compiled the footprint is very small.

Note: If you just have one app, they probably shouldn't follow this model and embed the components in your app directly.

6. Why do we focus on Universal JavaScript? #

  • SEO - Because Walmart.com is an eCommerce site, Search Engine Optimization is critical for our business model. To benefit from search indexing, SSR allows us to return an HTML string to search engines and our search analytics.

  • Reusability - At Walmart.com we handle highly complex user interactions at an unbelievable scale. ReactJS is the chosen framework to deal with this so our developers can create reusable components that we can then run universally: on the client and the server. Creating modular and reusable components has helped us to share the same code across several different pages and even different brands. The shared components all have one single source of truth and are easy to read, debug and implement, so our engineers can focus on building great features to enrich user experience.

  • Maintainability - "Code is a liability". Universal javascript allows developers to use modular components that are sharable, self-contained, and easy to reason about. We mentioned that we have thousands of components shared by thousand of developers at WalmartLabs. Creating strict best practices and tools like Electrode-Explorer help us to strengthen the increase in maintainability that Universal JS gives us.

7. Any plan with Graphql and React Native in the future ? #

We have plans for GraphQL, but it’s a bit further out. Regarding React Native, we are currently investing in it as we speak. Our first RN open source piece will be released in a few weeks, sometime in mid Oct :). I’m super excited about it.

8. Does electrode support hot reloading? #

hot-reloading of jsx is already built in electrode. gulp hot will enable hot-reloading.

9. Why does Electrode use Gulp? #

Initial versions of Electrode archetypes were certainly using npm scripts but we started running into a few problems and here are some of the brief benefits using gulp, we feel will help make it easy and simple for developers:

Benefits #

  • Maintenance: While npm scripts in package.json are simple, they are restrictive to shell commands, and can be messy to maintain since the shell commands have to go in the package.json files and separated from any extra work that requires JS code.
  • tasks integrated in JS: When we turn these scripts into JS files, we get the full benefits of writing any JS code as part of the build task. We no longer have to write JS scripts and then invoke them from npm scripts.
  • Gulp features: By using gulp, we get to use other gulp features, particularly the streaming feature, and if we could explore use cases that can benefit.
  • Community: npm scripts are generally for simple tasks, and for more complicate build tasks, the community is more a tune to a JS task runner such as grunt and gulp. Gulp being code centric vs grunt's config centric, has been gaining ground fast with a thriving supporting community. So going to gulp will be more familiar to the developer community.
  • Compatibility: At the moment our build tasks being shell scripts some are only compatible for Unix. If we go with tasks written in JS it's easier to make them compatible on other OS such as Windows.
  • Resource: With a large community behind gulp, there are a lot of plugins in the open source community for supporting various common build tasks and we can utilize them.

gulp scripts can still be wrapped in npm scripts here is an example of using using npm scripts to execute JS tasks in the archetype: https://github.com/electrode-io/electrode/blob/d4142ee0c938cbf973a429ee8467052aa4e1c9be/samples/universal-react-node/package.json#L22-L29