Transcript
This transcript was autogenerated. To make changes, submit a PR.
CMS stands for content management system and
this is a type of software that covers
all the applications for modification and
creation of digital content. The evolution of
the CMS is at the same time the evolution of the web.
So let's explore together how new
paradigm, new technologies and even new devices have
changed the web ecosystem landscape. Hi,
my name is Juan Felipe Gomez. I'm from Medellin, Colombia.
And since I started in this world
in web development, I faced with this term of CMS.
So I just want to share some of my experience with you.
You can find me on my social network as Gomez one FA
and first of all, I want to say thank you to Mari because he encouraged
me to do this presentation. And just by the record,
this is my first time as a speaker. Let's talk a
little bit about the beginnings of the web. The World Wide
Web started with static sites that provide content
without database queries.
These sites consumed minimal computing resources,
resulting in fast loading times.
This speed was due to the absence of
a complex backend.
It was in the middle of 1990s
as the Internet popularities rose and the
website started to require more frequent updates.
When we saw the first CMS products,
however, all those were proprietary and closed source,
which was typically for that era. But in
the early 2000s, we saw the emergence of open resources
CMS alternative, like WordPress, Drupal or Joomla.
In the case of WordPress, for example,
it counts with a set of plugins,
templates and many other tools that allow users to create
website without knowing CMS
or HTML.
The rise of the open source is
consistent with the development of the lamb infrastructure.
Lamb means Linux, Apache,
MySQL and either PHP,
Python or Perl. This new structure
marked the beginning of the monolithic web development, which facilitates
the creation of dynamic websites.
These websites uses database queries to provide unique
content for different users, and as a consequence
of this, the previous models of static sites
began to fade. Now,
let's discuss why to choose CMS.
What is this important? And basically
it's because it allows non technical
people like content creators, to manage their content
without advanced technical skills.
So CMS allow the control for both the
appearance and the content from a
panel that is easily accessible to everyone.
For example, let's imagine that you are food
blogger amateur, and you want to share your experience with the world.
So in the beginning of the web you would have needed
extensive HTML or CMS knowledge
or hire a developer if you want to
build your website. But just
with the help of a CMS, you can create, design and publish
your website just with a few clicks,
this level of accessibility has opened
up the web to a broader audience.
Now anyone with a passion and something
to share can create their online platform.
And this democratization of the web has led to a
richer and more diverse online world.
The mobile web came up and there was a
new paradigm. And the monolithic CMS
wasn't suited for serving content to diverse access
device, often requiring different version of
the website, typically simplified for mobile
users. Some devices and
IoT and devices such as Mars phones,
gaming consoles or voice assistants like Alexa just
further complicated this problem. The need
for an omnichannel delivery became
so evident. So now Disney
concept has emerged, the headless CMS.
And this is basically the separation, the backend
from the dont end and what
it's going to be new here. We are going to consume
the content through an API. So this is very important
because the backend is going to provide all
the data through an API and can be accessed
by any device. So it would be
available for a smartwatch, a gaming
console or even IoT devices.
Also, it's important to highlight that
this headless is not tied to a specific framework.
So we can use our preferred framework
like React or VOO to develop
our user interface.
Now what a headless CMS look like.
So if we see it from a non technical perspective,
for example our web visitor,
we can see that there's not going to be a perceived difference.
The traditional cms and the headless cms
are going to look like the same.
But if we see it from a technical
user perspective, the main difference is that we're going to consume
the content from an API. And this is the
main difference that we are going to consume
as a service. Now a new term
has emerged and this is Jamstack, and it doesn't refer to
a specific set of technologies.
This is more definition set,
an attempt to give a name to a set of widely used
architectural practices. So let's
zoom it out and see what exactly it is.
So this is basically what Jamstack means.
The J stands for Javascript, which is going
to be our preferred language because it's front end oriented and
we're going to be allowed it to use our
preferred framework such as react,
SBLD, angular or VuE,
and the a stand for APIs,
which is the way that we are going to consume our services.
And here we can find some services as of
zero cloudinary stripe or
WordPress. And you will see that WordPress is
just one of our services that
we can consume. And finally we have
the m that stands for the static size
generators that will assist us in the prebuilding
of our web page on markup.
And maybe the most important thing here is that for
a long time all the efforts were focused on the backend.
But we have what we have now. It's a modular stack on
the client side. This means that
we're moving away from being monolithic to create an
architecture based more on microservices.
So now this image can give us a picture
of what Jamstack ecosystem is
and all the services and products
that we have available. So as you
can see, we have many tools to develop
our applications. And finally I
want to share some resources with
you if you are starting with this approach
of building application, which is pretty interesting.
And the first one that I want to show you is this of
bursell that we have here. If you go
to Versaille and you go to the template section, you're going
to find a lot of templates.
And let's check for example here. If we
select here CMS and then we
have many examples of website, I'm going to choose this one.
And the first thing that you're going to see here is that you
can see the online demo here which is deployed now
in Bercel. And you can go to the repository
which is incredible because you can download this
code, you can run it locally and start
to analyze the code. I'm one of the person
that thinks that one of the better ways to learn
is reading others people's code and
this is just incredible. And the next resource is the
next JS application is the next JS page in the
section of learn. And as you know,
NextJs is considered the react
framework and it's powered by Bursell and
you're going to find a lot of resources here. The first one is this course
about next JS which
is 16 chapters. And you can learn all about Netjs.
And you're also going to find this react foundation course
if you need it. But what I want to show you
also is those resources down here
that for example they have building e
commerce sites with next JS and Shopify. This one is with
headless WordPress and net JS.
And all those things are following this
jam architecture.
Okay, so that was all and
I hope you have enjoyed this talk and I
see you for the next time.