[Music]
okay awesome uh so how we all do it
diese mm-hmm all right we're almost done
the enterprise people are going to come
up I'm going to kick ass for business
and so but before that i'm going to give
a super short talk on some react stuff
because a lot of us in the room who's
using react right now yeah look at that
that's a lot of people right there so
just some recommendations maybe we can
all get on the same page with theory and
react stuff
make some useful recommendations and
yeah just helpful helpful stuff so but
before that I have to do this because
you know we got to do it I brought I
brought this yeah we all see this that's
all it's a hard fork yeah yeah yeah yeah
all right come on we survive this we did
it we did it okay sorry that was just
like some stuff I wanted to do okay so
let's see if it works
it's a work oh maybe the other way
ya know oh good okay good so I'm
building this all into a boilerplate
it's not a framework all these
recommendations so if you like
frameworks use a truffle or embark and
those things this is just a configured
boilerplate so some good defaults but
nothing nothing you can't change very
small components and things like that so
yeah it's all defaults okay so just to
give you an overview of kind of some of
the stuff that's going to be inside of
this boilerplate of which i'm going to
give to everyone for free so contract
scaffolding so be able to offer the
command line just go okay i want to do
contract name and something get a
solidity file and it tests the contracts
in two languages so in javascript and in
solidity so and as well and enforces
that so that you cannot upload it to
github until you either
remove the test or actually written it
so you have to do either one and as well
things like wallet generation and
identity and fossa ting I've done during
the install and the whole point of this
is that if somebody comes to athyrium
they're like oh you know I want to build
a dab they can download it and hit and
basically run install everything gets
configured properly they don't need to
configure anything else it also runs it
runs offline the wallet is generated and
faucet it if it can be and and then you
hit em p.m. start and everything just
runs on a test RPC instance and the
contracts are deployed and the interface
is configured properly so the idea being
that making this whole thing really
simple it runs without internet so as
well it runs without using a note
architecture so I've actually by default
added things like block apps and in fira
so that you don't even need to run any
notes you can just deploy right away
so put the user interface stuff for this
i'm using max's react boilerplate i
don't know if any of you have seen it it
is amazing
and as well things like multi
environment awareness prices are listed
in USD first with ether listed second so
that you can get so that new users can
get sort of a value feel for the prices
that are being listed inside the dab and
then they can get the actual solid ether
price below
basic multi contract examples so
registry and a factory an example
configured in a complex deployment
setting and and as I said before offline
first so NPM start everything runs you
don't need to think about configuring it
with any sort of infrastructure or
network and so one thing that that I've
noticed over the past little while is
that there's sort of a data model
revelation going on with the front-end
world with redux and this sort of
Revelation is very similar to that the
blockchain space because we're figuring
out that's good state management in the
application layer and in our global
computer seems to be really really
effective for humans to build really
cool things and it really just comes
down to good data management so it's
just an interesting thought as I've been
working with this stuff for a while so
this is the react architecture that i'm
using it's called react boilerplate it's
available at that link there i highly
recommend you use or just analyze this
boilerplate when you are building DAPs
it's fantastic it's built to scale and
has something like it's almost at 10,000
stars on github so it's pretty awesome
and Max is really cool max was going to
allow me to sleep on his couch in Vienna
but turns out he was in Italy or
something and with its on Twitter you'll
see is a sad it's a sad moment when we
couldn't meet
so so some components of note in the
boilerplate post CSS its module modular
CSS that's on the side there using a
redux saga example using the new es6
function generators and yield
params prams you'll flag there and then
as well the main components to manage
states and data are Redux immutable jas
reselect for selecting things out of
state and and redox sagas so i highly
recommend you either take a look at this
see how they're built or just use it
yourself it's fantastic way to manage
data on the application side the
application layer and then as well I 18
end support for internationalization so
we can support things like the Chinese
language and the English language and as
well Redux router things like that on
the etherium integration side of course
the web three object I've built a
deployment utility that I'll show you
which very much like web pack called
eath deploy and it's highly config
configurable very own opinionated and it
just does deployment so it's kind of a
interesting utility for the sort of
stuff i'm using dapple to do solidity
unit testing i'm using solium to do
solidity linting because exists now it's
pretty cool it's not great some some
things don't work but you got to hand it
to IX to forget his name who wrote it
because it is really cool light wallet
which is generated when you install the
boilerplate but you can also run a
generation command to generate multiple
wallets if you want and once again the
whole idea here is that you download
this boilerplate and you see a full
etherium dap that's properly architected
to scale highly configured tests in
multiple languages has great contract
examples can deploy to multiple
environments at once and it's all done
for you for free and it's just to make a
theory I'm really easy for someone new
to come along and say okay that's the
architecture that's what it looks like
and these are some recommendations
and test our PC and so forth so this is
the scaffolding tool that's built in so
you can just run npm run generate and
you can scaffold things like components
for react routers language adding
additional languages and then adding
things like a contract so I've added
basically contract scaffolding and then
on the wallet generation management side
you see something like this and
basically typing in a passphrase and
using the light wallet utility and that
generates a nice wallet but it does it
outside of the repository because we
don't want everyone uploading a thousand
wallet files to github which would be
real shame and
and so this is eat deploy here it's a
module I'm still working on and I'm
still architecting but you can see it on
github and basically it's very much like
web pack so simplifying inputs to
outputs heavily following the UNIX
philosophy and making contract
deployment very much like a web pack
sort of package Minh packaging so you
can see here that
on the entry you're going to input your
environments things like test RPC
whatever you like in the classes to that
this doesn't do building it's just for
deployment and the output will be a
single environment potentially a path
things like that you'll have a module
here to do things like
complex contract scheduling and once
again these are all very dumb modules
but they do a very specific thing
so this is the dual layer contract
testing so you can see on the left we
have the dapple test and on the right we
have a chai theorem test chai theorem is
this awesome very light
tool to test contracts and that's
literally deploying it and then from
there you can actually do one line tests
and tests all of the methods in a very
simple fashion so this gets written
right away when you scaffold contracts
and it gets enforced right away and it
makes you basically
write all your tests for your contracts
and that gets packaged in with the rest
of the DAP architecture and that's what
it looks like as its passing so you can
see the dapple test on the top and the
chai theorem tests at the bottom then as
well another concept I want to run by
you is if you're accepting third-party
content into your DAP that means you're
exposed to a ton of vulnerabilities and
mainly cross-site scripting jection
which someone could inject some
JavaScript into your DAP and then do
things like change the all the addresses
so that you know something like I send a
thousand dollars to some guy's wallet
versus something else and so to prevent
that I highly recommend you use a
package called an XSS which is anti
script injection package things like
spoofing as well so many people can just
take all your code host your DAP and
then spoof it and change all the
addresses once again or do something
very low-level easy attack vector so
with that I recommend you do solid
communication channels and you have a
registry of all the people who have
spoofed your DAP and where it is so that
your users can have some kind of
awareness of where the spoof dabs are
because it's really not much you can do
oh sorry I go back okay
okay
okay how we doing so far pretty good
yeah am I done yeah yeah okay anyway um
so I'm basically done but follow the
UNIX philosophy is my last point and as
well
that's where you can get all of this
stuff to make building adapt very very
easy and super scalable and doing it
really quickly so thank you thank you
and next week acted in
[Music]
you