
WalmartLabs open sources the application platform that powers Walmart.com - Yhippa
https://techcrunch.com/2016/10/03/walmartlabs-open-sources-the-application-platform-that-powers-walmart-com
======
alexgrigoryan
My blog post that talks more about the release:
[https://medium.com/walmartlabs/introducing-electrode-an-
open...](https://medium.com/walmartlabs/introducing-electrode-an-open-source-
release-from-walmartlabs-14b836135319#.5j415go54)

~~~
parthdesai
Hey Alex,

I have a quick unrelated question. Why is Walmart.ca contracted outside if you
have walmart labs? Well at least the front-end. Hope it's okay to ask you
that.

~~~
doug1001
i believe i had read in a medium blog post that the .ca backend was build on
akka/scala

~~~
quicksilver03
The backend is built with Oracle Commerce (ATG), the frontend with Play
Framework (so Scala and Akka).

Source: [http://www.nurun.com/en/news/nurun-launches-redesigned-
trans...](http://www.nurun.com/en/news/nurun-launches-redesigned-
transactional-platform-with-walmart-canada/) plus private conversations with
people who have worked on the project.

------
kevan
Clarifying because I was confused at first: this is the React/Node.js tech
stack that the website is built on, not the ecommerce platform that drives it.

~~~
cygned
Yeah, I was hoping to see some very cool Clojure code.

------
danso
Given Walmart's deep contributions and investments in the Backbone ecosystem
[0], which were impressive in their own right, I'm even more impressed that
they seem to have switched to a React-based front end stack in a few years.
That seems pretty agile for a company the size of Walmart.

[0]
[https://github.com/walmartlabs/thorax](https://github.com/walmartlabs/thorax)

~~~
tluyben2
Although it is great that this happened and I applaud open source
contributions, especially by bigger companies, I wonder what the reasons for
such a rewrite were. And why the online platform manager approved it. People
often try to convince me of shiny-new-thing-39432 and sometimes we try on a
non-risk project and usually we find out it's the same or (more often) worse
than what we used before. I like React and theoretically (not practically
unfortunately) also Node but if I already have a site built in something else
the web team would have to come up with really over the top reasons (and prove
them after the roll out!) to just dump that investment.

~~~
alexgrigoryan
Great question, we definitely took a hard look on if we should transform our
tech stack or not (and decided to do it) - to really answer this question
though, you would need to understand our previous stack, what was holding us
back, and where we wanted to go. I'm not sure if reading about our previous
stack and why we moved is an interesting blog post or not :).

~~~
micaksica
> I'm not sure if reading about our previous stack and why we moved is an
> interesting blog post or not.

It definitely is. There is a serious business cost to front end trendiness, so
it's good to hear the legitimate business cases for these switches vs. "it's
what the devs want to code on."

------
sdegutis
[http://www.electrode.io/index.html](http://www.electrode.io/index.html)

> _" Electrode is a platform for building universal React/Node.js applications
> with standardized structure, best practices, and modern technologies baked
> in. Electrode focuses on performance, component reusability, and simple
> deployment to multiple cloud providers—so you can focus on what makes your
> app unique."_

Sounds like the missing piece of the puzzle everyone's been waiting for?

~~~
tracker1
The complexity isn't likely completely free.. but could be incredibly useful
for a lot of universal rendering scenarios... the above the fold content
loading, and the component render caching server-side is particularly
interesting.

Now if Walmart.com just didn't look quite so hideous... but that's another
issue...

The tech stack for electrode is definitely interesting, and looking forward to
playing around with it.

~~~
alexgrigoryan
I hope you like it! I personally think that the above the fold content, server
side caching, and redux-router-engine will make a positive impact on the
server side rendering react community. We saw HUGE gains in performance using
these.

We are working on a blog post that goes through the performance numbers we saw
on the live site.

I also think Electrode Explorer will be popular for bigger companies that have
many components.

[http://www.electrode.io/docs/electrode_explorer.html](http://www.electrode.io/docs/electrode_explorer.html)

P.S. I'm from the Electrode team.

~~~
tracker1
Thanks for the reply, yeah, from what I've read and seen so far it definitely
looks interesting... And seems to resolve a lot of the issues I had very early
on with ismorphic^wuniversal rendering back when Yahoo's fluxible app had just
come out. The render caching seems very cool as well, making up for the
general double-render for fetching data triggered from the component.

Right now at the day job I'm stuck in angular 1.x hell, though my contract is
up in a couple weeks and looking for something in the React space again. Too
much angular work in Phoenix to avoid completely though.

Aside: wish I could get a hold of a hiring manager there if you have space for
new people, have never even gotten a callback from walmart labs, and would
love to work for your org.

~~~
alexgrigoryan
Your contact information is in your HN profile, I'll have our recruiters ping
you with the opportunities we have available @WalmartLabs.

~~~
tracker1
Added more contact info, thanks... I'm @tracker1 on github and npm as well.

------
heroprotagonist
This is somewhat surprising, in a good way. A lot of large companies are
pretty risk averse, and this prevents them from releasing the source for their
shopping platforms into the wild. I'm sure there are some differences between
the open source version and what they actually run.

Is this the complete platform? What's held back? I would think the analytic
tools for usage and sales, how they store user data, and perhaps whatever they
use to build profiles about individual users' shopping behavior. But that's
just speculation.

~~~
alexgrigoryan
Electrode is just the front end platform. We also have OneOps for our app
server lifecycle management. Test Armada for automation.

I don't know of anything lower in the stack that was open sourced than what I
mentioned.

The stuff we didn't put into the Electrode platform that is integrated
internally, off the top of my head:

1\. Integrations to our global config manager, that allows us to turn flags
on/off in real time.

2\. Integrations to our A/B Testing Tools

3\. Integrations to our content management

4\. Logging/Analytics/Metrics Integrations

5\. Our CSS styles and Icons

As you can see, almost everything is open sourced :)

------
ryanmccullagh
For what it's worth, the walmart.com websites takes forever to load (> 10
seconds) on my single core laptop in Firefox.

edit: I should also state that my OS is Ubuntu.

~~~
makmanalp
Same here, 10ish on OSX with Chrome.

~~~
jameskegel
Antergos, i7, chrome, 6 seconds. I'm not thrilled, but I applaud them making a
step forward for the community.

------
smaili
tldr - [http://www.electrode.io](http://www.electrode.io)

------
simlevesque
I use Hapi.JS everyday and it's a bliss. Will check this out.

~~~
igravious
(Seems Hapi.js is built in?)

[http://www.electrode.io/docs/what_is_electrode.html#features](http://www.electrode.io/docs/what_is_electrode.html#features)

Electrode Boilerplate comes fully loaded with the best technologies available:

    
    
        • React is an awesome JavaScript library for building user interfaces, created by Facebook.
    
        • Redux a predictable state container for JavaScript apps. #game-changer.
    
        • React Router is a powerful routing library built on top of React.
    
        • CSS Modules a CSS file in which all class names and animation names are scoped locally by default. Fixes the problem of the global scope in CSS. #winning
    
        • Universal rendering built in.
    
        • Webpack a powerful module bundler.
    
        • Webpack Isomorphic Loader a powerful tool that makes NodeJS require understand files such as images for SSR.
    
        • Babel transpiles ES6 + 7.
    
        • ESLint a pluggable linting utility for Javascript.
    
        • Mocha a feature-rich Javascript testing framework.
    
        • Enzyme a Javascript testing utility for React, created by airbnb.
    
        • TravisCI a continuous integration service to build and test software projects.
    
        • Gulp a Javascript build tool that lets us automate tasks.
    
        • Yeoman a Scaffolding tool for modern webapps.
    
        • History a Javascript library for managing session history.
    
        • Bluebird a great Javascript promise library.
    
        • Electrode Confippet Confippet is a versatile and flexible utility for managing configurations of Node.js applications.
    
        • Electrode JWT CSRF Cross-Site Request Forgery (CSRF) protection with JWT.
    
        • Electrode-Redux-Router-Engine An Electrode routing and rendering engine using react-router and redux.
    
        • Component Caching Optimize React SSR with profiling and component caching.
    
        • Electrode-Server A configurable web server using Hapi.js on top of Node.js.
    
        • Electrify Tool for analyzing the module tree of webpack projects.
    
        • Electrode-Docgen A custom metadata extractor for the Electrode framework, automates component documentation.

~~~
alexgrigoryan
That is correct, but please take a look at my other comment that explains
where we are going with the hard tie to Hapi.

------
dcgudeman
I have tried on multiple occasions to get started with react and every time
the large amount of setup prevents me from getting anywhere useful. After
looking over the docs I am somewhat hopeful that this might bridge the gap.

~~~
jimmyhmiller
[Create React App]([https://github.com/facebookincubator/create-react-
app/blob/m...](https://github.com/facebookincubator/create-react-
app/blob/master/README.md)) simplifies setup greatly. I'd really recommend
giving it Ila try.

------
cutler
What happened to Clojure? I thought Walmart Labs was one of Clojure's
flagships.

~~~
projectileboy
Clojure is used at Walmart Labs, but Walmart Labs is pretty big - there's a
lot going on, and a lot of different tech.

------
leesalminen
I just tried out the Electrify [0] package on my codebase. It visualizes your
webpack output. Very helpful!

[0] [https://github.com/electrode-io/electrode-
electrify](https://github.com/electrode-io/electrode-electrify)

------
crudbug
What are the server memory consumption numbers for this ?

How is this different from Hypernova [0] ?

[0] [https://github.com/airbnb/hypernova](https://github.com/airbnb/hypernova)

------
plan6
To any Walmart developers reading: thank you for open sourcing this!

However, there's something I'd like even more than your time spent on this
project. Currently, walmart.com will indicate to customers that there is
inventory available in-store that there sometimes isn't. This can lead to a
terrible customer experience when you order something that runs out of stock
after you order it, and your order is just cancelled. It seems like there
should be the ability to have it backordered at the price at which you
purchased. Could Walmart instead always honor the price at which an item was
purchased online even if stock in-store runs out, and give the customer the
option to cancel the order or get a 20% discount on any item if you don't want
to get it on backorder? Right now this can be done, but it requires the store
manager's approval, which can involve having to file a complaint, which seems
completely unnecessary.

------
debacle
Very cool. I've watched a few of the videos that the Walmart guys did on
various topics (really scaling, RUM, etc) and they clearly know their stuff.

------
Negative1
Curious; is this stuff being developed at the location out in San Bruno (in
front of Youtube)?

~~~
alexgrigoryan
The Application Platform team (folks who created Electrode) is mostly based in
the Sunnyvale office.

------
marccantwell
Archetypes? Gulp? Welcome to the age of vapidity, where Meaning is pastoral
and abstraction sacred.

~~~
exogen
Ironic given that your comment is the most vapid in this entire thread.

~~~
marccantwell
Completely valid. I should have been more direct, but that wasn't the intent.
Since you took the bait, I take issue with the seemingly flipant manner in
which words are assigned new meanings, and existing concepts are relabeled.
While the concept of archetypes is intellectually really fun to consider, it
makes more difficult the ultimate project of speaking a common tongue. This is
not an orthodox point of view, this is primarily economical. Far too much
cognitive effort is required to learn new paradigms that turn out to be fresh
takes on old ones, so best to identify them early and move on. But we should
be critical as a community to self-regulate, as the marginal utility of each
moment of learning is weighed against a million other potentialities.

~~~
alexgrigoryan
Happy to receive feedback, do you have suggestions on what we should call it?

~~~
marccantwell
You might do just fine substituting archetype with template. The readme for
[https://github.com/electrode-io/electrode-archetype-react-
ap...](https://github.com/electrode-io/electrode-archetype-react-app) reads:
"This "app archetype" provides for common patterns across all app projects so
that each app project can standardize on common development behavior and
patterns. Its essentially pre-made patterns for build scripts." "A pre-made
pattern" sounds a lot like a template. The majority of the documentation
focuses on applied concepts, with familiar terms. The only reference to
archetypes is found in the first paragraph of What is Electrode, and I think
it distracts and confuses more than it helps. If it is a core concept, then it
might be good to link to
[https://github.com/FormidableLabs/builder](https://github.com/FormidableLabs/builder),
but I don't yet see where or if builder is included as part of electrode.

------
giardini
My experience is that Walmart's website is truly abysmally poor. Releasing
their software is likely a scourge upon other commercial vendors who might
inadvertently try to imitate them.

~~~
hackerboos
Prices take longer than the rest of the page to show up and occasionally you
will get a Price: [NaN]

