►
From YouTube: Making Capacitor Flux with NativeScript and an Ionic Friend - Nathan Walker, nStudio LLC
Description
Capacitor is an open source runtime for building Web Native apps backed by the Ionic Framework team allowing you to take your JavaScript app and submerge it into the exciting world of platform api’s and devices for diverse developments. NativeScript is an open source technology empowering JavaScript developers with access to native platform api’s. The marriage of Capacitor and NativeScript provides some exciting capabilities for enriched development experiences and end user satisfaction. Let’s take a look together at how we can make Capacitor “flux” at 88 mph with NativeScript for far reaching JavaScript applications.
A
A
B
A
Native
language
that
is
used
on
that
particular
device
platform,
objective-c
and
swift
being
used
on
ios
and
mac
os
and
java
in
kotlin,
for
example,
being
used
on
android.
What
we
see
here
in
this
example
is
a
snippet
of
objective
c
code
that
we
can
write
using
native
script
with
familiar
javascript
syntax.
This
is
all
without
leaving
your
javascript
ide
and
allows
you
to
go
to
source
documentation
without
learning
a
whole
new
set
of
apis
just
to
get
at
that
particular
platform
api.
A
Another
example
here
showing
a
java
class
which
extends,
for
example,
java
laying
object,
and
we
can
also
construct
one
of
these
using
javascript
semantics
and
we
could
pass
it
an
array,
a
typical
javascript
array
to
that
actual
method
that
was
in
that
java
class
again.
This
is
all
occurring
in
real
time
in
front
of
you
in
your
javascript
development.
A
What
this
leads
to
is
a
number
of
interesting
development
scenarios,
for
example,
because
you
have
full
access
to
the
platform
apis.
You
obviously
have
access
to
the
platform
view
language
as
well.
Nativescript
provides
a
core
library
that
gives
a
pretty
concise
view,
markup
language
on
top
of
this
as
well.
If
we
look
at
nativescript's
core
repo
here
and
we
dive
into
the
source
code,
you'll
find
familiar
classes
for
those
particular
platforms
at
their
base.
For
example,
every
layout
container
on
ios
is
actually
a
ui
view,
like
you
would
typically
do
with
ios
development.
A
A
But
what
if
you're
not
familiar
with
platform
view
development
and
your
particular
development
style
is
with,
of
course,
html
and
the
dom.
This
is
what
the
great
team
at
ionic
has
developed
with
ionic
framework.
These
are
really
high
quality
toolkits
that
you
can
build
mobile
uis
using
the
familiar
dom
this
lets
you
build
these
controls
fully
with
html
and
a
whole
framework
behind
this
to
deal
with
different
paradigms
on
that
particular
device
ui,
the
ionic
team
has
also
developed
capacitor
js,
which
is
the
mobile
run
time
that
allows
you
to
take
these
web
view.
A
A
F
B
A
You
know
see:
I'm
super
excited
about
this
app
we're
building,
I'm
already
having
a
ton
of
fun
with
angular
and
capacitor
3.,
and
yesterday
I
started
prototyping
a
few
of
the
key
features,
but
I'm
running
into
a
little
bit
of
trouble.
Like
I
tried
a
few
available
video
plugins,
I'm
struggling
to
get
that
yeah.
That
picture
in
picture
behavior.
You
know
like
when
you
switch
apps
and
you
get
that
little
tiny
box
of
streaming
video.
I
can't
quite
pull
that
off.
You
have
any
ideas.
A
B
B
B
B
B
A
B
So
now
I'll
see
you
can
get
some
nice
intellisense
and
we'll
choose
to
use
the
new
method
on
the
controller,
it's
really
a
convenience
method
which
helps
us
to
create
a
native
instance
of
that
controller.
So
now,
back
to
the
component,
the
angular
component.
As
you
see,
we
use
the
helper
that
we
created
from
the
native
object.
A
B
A
B
B
B
B
A
A
B
A
B
A
B
B
E
E
A
You
know
see
I
was
thinking
I'm
following
what
you're
doing
here.
It's
pretty
straightforward,
I'm
going
to
add
an
on
event
and
remove
event
api,
and
I
want
to
create
a
little
event,
bus
system,
where
we
can
shuttle
some
events
around
what
we're
doing
and
I
feel
like
we
can
do
some
neat
interactions
with
our
capacitor
app.
B
A
B
A
B
A
A
A
A
A
Oh,
this
is
pretty
sweet,
so
this
is
the
on
event,
api
that
I
added
here
and
we
can
now
wire
into
events
that
are
coming
off
anything
that
we
created
over
there,
and
this
will
give
us
some
good
reaction
points
in
the
dom.
So
we
could
perhaps
maybe
maybe
we
could
have
a
scrolling
area
of
text
that
actually
scrolls
up
and
takes
the
whole
screen
when
the
video
pops
out
in
picture
and
picture
it.
I
assume
we
could
probably
do
that
sort
of
thing.
B
B
A
A
Got
it
well,
I
could
probably
do
ios.
I
know
that
in
the
docs
it
mentions
using
the
current
device
battery.
I
think
monitoring
enabled
allows
me
to
turn
it
on
and
off
and
from
there.
I
think
I
can
use
just
a
standard,
ios
observer
to
basically
observe
a
system
notification
when
the
battery
level
changes.
A
I
I
think
that's
straightforward
enough
and
will
probably
give
us
the
the
notice
that
we
need
so
I
can
probably
use
this
looks
like
we
got
intellisense
on
it.
There's
a
battery
level
did
change
notification.
We
can
wire
in
too
and
these
other
arguments.
I
don't
think
we
care
about,
so
we
can
just
get
our
call
back
and
emit
when
that
occurs.
So
we
get
sort
of
the
same
thing.
A
percentage
of
battery
level.