| 0:05 |
good evening everyone welcome to the february 17 |
| 0:10 |
edition of the southern fried dnn user group we are coming to you here at the very end of february always the third |
| 0:17 |
thursday of every month uh but we have just finished off last week |
| 0:22 |
bnn summit the premier user group conference an event that we helped put |
| 0:29 |
on every year and enjoy seeing many of the dna community come together both to |
| 0:34 |
present content and concepts and exciting ideas but also connect with a bunch of new |
| 0:40 |
people who we haven't run across before and talk about how we love cnn and those types of things and that's one thing |
| 0:47 |
we're going to do tonight is we're going to do a little recap of things that we saw and learned and |
| 0:52 |
some of the things that came out of dnn summit and we'll be doing that first off uh tonight |
| 0:58 |
and then we'll be going over to talk a little bit uh about community projects and highlights david poindexter will be |
| 1:04 |
running through that and i believe that you and daniel have things to run through right |
| 1:10 |
yes sir and then we're going to open it up for some other highlights the other people might have as well |
| 1:16 |
that sounds good that sounds good um well then uh just to uh you know jump |
| 1:22 |
into it uh we do what a couple of other things uh sponsor recognition and community buzz i |
| 1:29 |
kind of feel like there's not a lot of additional community buzz out there right now other than |
| 1:34 |
what we just finished doing which was dnn summit that kind of sucks a lot of the time and the events |
| 1:41 |
uh energy out of the community uh focusing into that for a week um |
| 1:47 |
is there anything that we should mention for community buzz that isn't from dna summit [Music] |
| 1:55 |
giving you some community buzz there to talk about man come on absolutely there's a lot of people here with the |
| 2:01 |
buzz um there are things around uh you know we will talk about a couple of different |
| 2:06 |
things but you know one of the items that will stroll posted towards the end of the conference was another uh bounty |
| 2:13 |
suggestion from dnacommunity.org about posting blog posts and posting |
| 2:19 |
information out on the site that's something that was done around christmas time and had a couple of uh blog posts |
| 2:25 |
and things come out it's a very nice suggestion that's being sponsored by |
| 2:31 |
both will stroll and upendo ventures and david poindexter and envisionated to |
| 2:36 |
kind of help get some new blog posts out there if you're |
| 2:41 |
interested in doing it or thought about doing it before this could be a thing that helps spread on for you |
| 2:50 |
all right then uh daniel uh vladis is wearing the shirt uh from the dnn summit from |
| 2:57 |
last year or the year before two years ago yeah |
| 3:02 |
we were all there just recently let's uh let's go ahead and dive into it for a recap of dnn summit 2022 |
| 3:09 |
um i'll start off by mentioning that uh you know this year the system uh was the |
| 3:14 |
same we were in the hop in platform and uh it was very nice to see that the hop-in platform had a few improvements |
| 3:21 |
uh compared to the platform that we used last year which was just out of beta it was just fresh |
| 3:28 |
maybe the first year being used there was some polish there's some additional items and elements that were there uh |
| 3:34 |
one very nice feature is that all of the sessions were automatically recorded |
| 3:40 |
uh so if you did uh pay for a ticket then we're part of cnn summit uh both later in the evening |
| 3:48 |
you could go back and watch those videos um you know we had four sessions going on |
| 3:53 |
at every point in time that there were sessions blocks um and you can only be in one at a time so |
| 3:59 |
it's very nice that you could finish off your day by going back and catching uh you know one or two of the ones that you |
| 4:04 |
missed and though there was a little snafu towards the end of the summit uh with |
| 4:10 |
releasing those or getting access to those from hop in um in an easy method that was worked out |
| 4:16 |
and now those videos are posted so if you attended the conference you do have a link uh so that you can get back |
| 4:23 |
to those videos and watch them um to both you know just go through the things |
| 4:28 |
you went through before but also go through anything else that you missed and uh pick up that good uh session |
| 4:33 |
content uh information um i thought uh to kind of uh you know |
| 4:39 |
kick off the recap i would walk through a couple of screenshots and talk just a little bit |
| 4:44 |
about some things there to begin with i will mention that we had our primary |
| 4:51 |
six gold sponsors that were present throughout the conference |
| 4:57 |
both in promotion through the conference but if they wanted they could also have a special booth or a session that went |
| 5:05 |
along with their sponsorship so several other sponsors had booths where you could stop in and talk and hang out |
| 5:12 |
with them and ask questions um previous years it was almost used as a |
| 5:17 |
hey i've got you for 10 minutes what's a question you know can i help you answer a question and people were |
| 5:22 |
going through with questions uh this year was a bit more informal uh i only got to hang out in in one or two booths |
| 5:29 |
for a few minutes uh david or daniel cheryl did you hang out in booths they |
| 5:34 |
seem to be much more of a hangout this year and it was conversation and jokes and actually literally jokes one session or |
| 5:41 |
one booth we were all telling and trading jokes back and forth um uh you guys have some um you know |
| 5:48 |
highlights or thoughts from the booth that you hung out with with sponsors |
| 5:55 |
yeah i just dropped by a couple of the booths and talked to uh i think |
| 6:01 |
cassidy um [Music] i talked to will stroll in his booth a |
| 6:06 |
little bit just dropped in and talked for a few minutes it was really fun i went to hang out in |
| 6:12 |
some of the other sponsors booths uh for a little bit and hang out with cassidy in the 10 pound gorilla booth i hung out |
| 6:19 |
with will in the pindo ventures booth and she got to talk with chris hammond i |
| 6:25 |
think uh it was in will's booth that was that was cool hanging out with him for a bit |
| 6:31 |
we had a few people drop in our booth and hang out and ask them questions i met some new people that i had never met |
| 6:36 |
before in the community and really interesting roles that they're in in the |
| 6:42 |
way that they use dnn and so forth so that was really fun i don't know if you're going to talk |
| 6:47 |
about the sessions but uh i do have something to say about those sponsor sessions |
| 6:54 |
oh go ahead for the sponsor sessions yeah i i really enjoyed that that was actually a slot this year um i was |
| 7:01 |
impressed with actually every now one i didn't get to see yet because it was at the same time as ours but |
| 7:08 |
the other one i kind of bounced back and forth between their two sessions and it was really cool because it wasn't you |
| 7:15 |
know like a hey look what we do or what we can offer yeah it wasn't a sales kind of thing it was |
| 7:22 |
more of hey here's we've had years of experience doing this or that and here's |
| 7:28 |
a way that it can help you and you know you can apply these things to yours i really enjoyed doing ours because it |
| 7:34 |
gave us a chance to share some things that people may not know about you know us and kind of how we |
| 7:41 |
think about with things it was really nice because i think that could be helpful to to a lot of people you know |
| 7:46 |
regardless of whether or not they want to leverage our services for anything so i was really glad that was not an |
| 7:53 |
intentional thing this year yeah yeah yeah i agree and i think it's something that we haven't exactly had |
| 7:59 |
like that before um maybe a little concerned that it's going to be sales pitchy and it it just wasn't but you |
| 8:06 |
know these sponsors are all here to help and be involved they are business people they need support uh they need new |
| 8:12 |
clients and projects but at the end of the day they're we're all in the same dna community and they want to help |
| 8:18 |
people and they want to learn and participate so i feel like the sessions were the sponsor sessions were uh a good |
| 8:24 |
representation of that um to your point i enjoyed the i'm |
| 8:30 |
moderating was in the one for uh 10 pound gorilla and you'll notice through the sessions that |
| 8:36 |
were happening through both days there were multiple different 10 pound gorilla people giving different sessions um |
| 8:42 |
advertising and marketing versus skin versus seo and ada compliance type |
| 8:48 |
things so they pulled from all their different sessions two tips or maybe three tips from each |
| 8:54 |
one and they made the top 10 tips from denmark and it was really like a little window of the different sessions that uh |
| 9:02 |
that they had and i thought that was pretty cool that was very creative |
| 9:07 |
um so you know i'm just gonna kind of go through and talk about some of the different sessions that i remember and |
| 9:13 |
uh you know thought something about um and what i'd like to kind of open it up to uh all of us here online is just to |
| 9:20 |
share some of the things that we might have learned or remembered or got presented from from the different uh |
| 9:27 |
speakers that were uh there for two days we had multiple uh |
| 9:33 |
session blocks throughout the days and there were like i said four sessions per block uh so we ended up having a large |
| 9:39 |
volume of content um a lot of the people who were putting that content together |
| 9:44 |
and presenting it are the people that we've heard from here at southern pride they're the people that we know |
| 9:50 |
um and enjoy getting to connect with but sometimes they're presenting new content or they're presenting new things that we |
| 9:57 |
um you know don't have the time to or we're focusing on one thing this was an hour where we could really get into there for |
| 10:04 |
for a deep dive one of the things that i'll mention is that |
| 10:10 |
you know from a security standpoint and a dnn performance or optimization standpoint |
| 10:17 |
i'm always interested whenever i can sit in on a session with mitch sellers and um |
| 10:22 |
i know a lot of the things that he's going to say because i've listened to past sessions he's had so i'm paying close attention taking notes with a |
| 10:28 |
notepad but one of the takeaways uh that i grabbed as new |
| 10:34 |
information that i maybe suspected but hadn't ever confirmed or haven't had never tested but um |
| 10:41 |
did see that he um said that for a for a security footprint |
| 10:47 |
uh of your dnn instances uh that he recommends now uh that we remove or |
| 10:53 |
rename and get rid of two folders in our running |
| 10:58 |
dnn instances and that is the documents folder and the license folder those are |
| 11:04 |
necessary when you're doing the install they're part of the package that gets delivered and installed but just to help |
| 11:10 |
in reducing the identification of your site as dnn he recommended removing the |
| 11:16 |
documents folder and the licenses folder uh from the dnn route and i thought you know i didn't come here looking for new |
| 11:22 |
tips or new items that i've never heard before but there we go two new items i'm gonna put that down into my list now |
| 11:29 |
um how about everyone else you have some memories of things that you uh ran |
| 11:35 |
across or heard knew or uh you know appreciated uh having a speaker present |
| 11:40 |
to you and welcome to helene and jeremy i just came on and john i didn't say hi earlier |
| 11:46 |
but good to see you |
| 11:51 |
yeah so i haven't watched all the recorded sessions yet and i was presenting two so uh there were some of |
| 11:58 |
them that had conflict with mine but i really appreciated the uh mitch's presentation about uh |
| 12:05 |
performance and security was very interesting i liked the ux |
| 12:10 |
presentations also as a developer it's fun to see a perspective from more |
| 12:15 |
of a from a user perspective to refund prompt session that i saw was |
| 12:22 |
interesting also i have to play with this more was uh very interesting |
| 12:31 |
i enjoyed uh there was of course we use structure content a lot you know for too sexy stuff aaron lopez had a session on |
| 12:42 |
doing mega menu with um 206c and it was really nice to |
| 12:48 |
kind of see that creative use of doing it and it provided a way for |
| 12:54 |
administrators to manage the content inside of their mega menu it's really cool creative way to to handle that |
| 13:04 |
what session of his was that in i want to go watch that yeah that was the uh it |
| 13:09 |
has mega menu in the in the title um but it's aaron lopez yeah i'm just looking |
| 13:15 |
for his his photo and his uh his gray hair yeah |
| 13:33 |
uh aaron joined me on uh dean in jeopardy i put the call out early in uh |
| 13:38 |
summit to ask who wanted to sit in and participate with uh dnn summit uh helene |
| 13:44 |
was a good sport and came and joined us there too um we had we had several |
| 13:49 |
people come on and had a lot of fun with that that's uh you know something that we may |
| 13:54 |
put out in some other way uh if we have a open spot in uh so fry we might play |
| 14:00 |
that game again but i always enjoy putting those together had a couple of people ask me how i keep coming up with |
| 14:06 |
questions and it is hard so if if you think about questions sometimes you think hey that'd be a good question pass |
| 14:11 |
it to me i'm sure i'll use it again in the future that was actually um really great to |
| 14:17 |
participate in um i've because i don't know too much about the logo for nate and the question came up |
| 14:24 |
from where which folder to least uh do you know so from that and obviously my disastrous |
| 14:30 |
answer on it but um learn you know learn a little bit more about it so we can research oh what is that what is you |
| 14:37 |
know how does it all work so yeah it's got a bit of a takeaway from that yeah it was good |
| 14:42 |
fun that's a fantastic outcome i love that yeah yeah |
| 14:48 |
now that's a true growth mentality right there i love it [Laughter] |
| 14:53 |
oh yes no but yeah i can even going back to look at some of |
| 14:59 |
the questions it is um you know i think they were quite really well put together and i've obviously never played jeopardy |
| 15:06 |
before so you know it was quite fun [Laughter] but um also um just existed you were |
| 15:13 |
talking about the mega menu um presentation that um aaron did yes i did i do find um has |
| 15:20 |
been this is just been really really great to watch um especially around tailwind as well and that's something |
| 15:26 |
that i'd like to learn a little bit more more about um also you know how to actually use that within at the end you |
| 15:34 |
know get it developed into a dnn theme how to package it up and then use it in |
| 15:40 |
our sites so that's something i'd like to learn more |
| 15:46 |
i mean we're working on it on an envy quick theme for tailwind oh i hear that's exciting |
| 15:54 |
the quick wind be quick wind |
| 16:00 |
tailwind is one thing but watching aaron do tailwind is especially rewarding |
| 16:07 |
i like it when he's fumbling you know through it uh that's really fun i'm just kidding he's so fast at it and he like |
| 16:15 |
design thinks on the fly it's really impressive |
| 16:21 |
it sounds like he's our mvp for presenter at uh at summit because uh i think everybody enjoyed them i |
| 16:28 |
uh moderated one of his first ones uh or sat in on one of his first ones and enjoyed that too i know i really enjoyed |
| 16:33 |
it daniel valada's sessions too actually both of his sessions were really good |
| 16:39 |
one on web components and uh the other one on the on the template |
| 16:44 |
system is really really nice it was great but um you know i showed up |
| 16:51 |
thinking it was web components and halfway through they changed the title and it was included in slowly the slides |
| 17:00 |
but it was all right i was interested in web api too so it was awesome yeah in the recording template it was web api |
| 17:06 |
sorry actually |
| 17:15 |
well uh any other thoughts or things that you learned or appreciated about this year's dnn summits maybe things |
| 17:20 |
were different or unique from last year's comparison i was a little disappointed in the |
| 17:27 |
networking feature it didn't seem to work um i don't know maybe i was doing it wrong |
| 17:34 |
but i went in several times and it would just spin say it was waiting do nothing |
| 17:39 |
personally yeah yeah on screen i have the hop-in interface and i think jeremy |
| 17:46 |
that's one of the big things is that last year the first year we used hop-in i think everyone was testing or trying |
| 17:53 |
different things a little more or maybe we weren't exhausted from yet |
| 17:58 |
another year of covid so i feel like although everyone enjoyed |
| 18:04 |
the sessions and everyone participated in communications and chats some of the networking get to know other people you |
| 18:11 |
don't know features like networking um i think those fell by the wayside they either weren't used very much or perhaps |
| 18:17 |
in the interface they weren't working correctly because like david i went in several times and |
| 18:22 |
just left it open while i was doing something no one came in um that's how it does it is it waits for |
| 18:28 |
people to come into the waiting room and then it does like i don't know um |
| 18:37 |
you know and taking your point if they're open to suggestions um next time if there's a significant virtual |
| 18:43 |
component to it and especially hop in i think they should plan to have |
| 18:49 |
sessions that are nothing but show up in chat and here's the one or two topics of choice because i would |
| 18:56 |
definitely do that but i i'm not as likely to click on that networking thing and go face to face with just one person |
| 19:03 |
you know right and maybe that oh my gosh |
| 19:13 |
you know along that line uh a i both suggested something like that to hop in but yeah um jeremy just in the uh you |
| 19:20 |
know the summit board that's part of what we were talking about is maybe allocating some specific blocked off time to do |
| 19:27 |
networking and yeah to have people get together think about last year remember how much fun it was a |
| 19:33 |
whole bunch of people stayed at the end i missed the end this year so maybe it happened again but my god that there was |
| 19:39 |
like 50 or so people in the room and it was a great time uh when it ended last year |
| 19:46 |
it was really a high note for me anyhow |
| 19:52 |
yeah it happened this time but it wasn't as many people and maybe not as lively because you weren't there jeremy |
| 19:58 |
all right it was because i wasn't there i know i know i hear you yeah so sorry so in the interface i have on |
| 20:05 |
screen we kind of have some of the things that are there and i'll point out that you know there's that networking part like we were talking about the |
| 20:11 |
expos the boots area where you can go see uh the different sponsor boots there was a lot |
| 20:17 |
of hanging out in sponsor sponsor booths um will stroll did go to las vegas and |
| 20:22 |
so he was both on location and people coming in and out of his room and having an online booth |
| 20:29 |
that replay was a button for the videos but i will point out that you know that |
| 20:34 |
you know during some of the times this was a screenshot from the keynote uh we had 140 to 150 people online during |
| 20:41 |
those different things so it kind of it definitely started off strong with a lot of people in for content and then when |
| 20:48 |
it did finish jeremy um we uh we're kind of wrapping things up and |
| 20:53 |
everyone was chatting and having a good time in the chat and we finished by bringing in ron miles |
| 20:59 |
uh dnn summit yeti songs uh so we uh we put both of |
| 21:05 |
those on the air and that was a lot of fun and i'll say the same thing i said last |
| 21:10 |
year i feel like we lost a little bit of momentum i really think this type of thing would be better every |
| 21:16 |
six months at least just me well that's what we do here this is the |
| 21:23 |
every month whoa doesn't have to organize it right |
| 21:33 |
all right jeremy's the yard of good point mini summit the intra summit uh that we have between |
| 21:42 |
not a terrible idea well um you know we we know that we will |
| 21:47 |
have one next year um over the next several weeks we're putting together meetings to talk about timeline and |
| 21:54 |
um presence and where it's going to be and how it's going to be we continue to see that |
| 22:00 |
online has a large proponent of people participating and active |
| 22:07 |
i think that in person has another group of people i think it's interesting that with |
| 22:13 |
different kinds of organizations like this when they have events when you have more events you have more |
| 22:18 |
different people show up you don't just split the group that you have and i feel that's going to be the case when we when |
| 22:24 |
we start talking about seriously switching from uh virtual only to in-person only or |
| 22:30 |
in-person and virtual still hybrid i think that every time we have the |
| 22:36 |
dnn summit we get a new group of people easily 25 to you know 40 percent of |
| 22:42 |
people are brand new first time never been to a dean and summit before uh |
| 22:47 |
audience so we'll always have a group of new people regardless of whether we hit us uh you know hit las vegas next year |
| 22:55 |
and try to be in person there again or whether we decide to do virtual one more year but that's that's all being decided |
| 23:01 |
here over the next several weeks one thing i'd just like to point out is |
| 23:07 |
i didn't realize it was happening um i |
| 23:13 |
just looked back and i don't have anything with dnnsummit.org since 1999. |
| 23:20 |
i did get an email from managed and man beeps uh |
| 23:26 |
talking about this conference but i was on vacation and not processing emails |
| 23:31 |
efficiently but two emails wasn't enough and i don't |
| 23:36 |
love to be on lots of email lists but still i would have thought i would have wound up getting a little more |
| 23:42 |
information so something from somewhere it's good that it came from uh sponsors and from some |
| 23:48 |
of the people who were helping promote the events though that it's good that you've got something for sure yeah wow yep you know |
| 23:56 |
conference absolutely accidentally unsubscribed from the list uh because they did the organization did send out |
| 24:02 |
quite a few um emails over the period of yeah i got i |
| 24:08 |
got a lot of emails so from dnncommunity.org or something else |
| 24:13 |
from dnnsummit.org oh okay |
| 24:18 |
yeah um that's a good point if the community uh website has a list to send from there |
| 24:25 |
yeah now we have the opposite problem we need to take down the marketing and advertising this at lots of places like |
| 24:32 |
uh dean and corporates dnasoftware.com still has a riding banner uh dean and community still has our riding banner up |
| 24:38 |
there uh we've got uh we've got a few places we've got to bring it down from |
| 24:44 |
yeah i don't think i've ever signed up at dnn summit so okay yeah yeah |
| 24:52 |
uh all right well um now we uh kind of move into some more community-related |
| 24:58 |
things if we were talking about the community conference the one that is put on you know for the community by the |
| 25:04 |
community and dnn summit we now talk about the the actual things that matter to dnn from the community |
| 25:12 |
we've got community project highlights and i'll pass it screen share and uh material |
| 25:18 |
over to you uh david and |
| 25:25 |
might help if i unmute huh did i share the screen right yep we're |
| 25:31 |
on your screen you're sanding in summit yeah oh okay good good good okay yeah i don't |
| 25:37 |
see the little green box around it for whatever reason so it was a little weird |
| 25:43 |
um so there's a few things that i wanted to take the opportunity to highlight |
| 25:50 |
you know in a community as large as the dna community sometimes it's easy to miss |
| 25:56 |
details about things you know just like john was saying you know didn't even realize there was an event going on or |
| 26:01 |
whatever you know i mean it's just easy to miss things because there's always so much going on in different mediums and |
| 26:07 |
and so forth so maybe mentioned some of these things before in passing you know in various |
| 26:13 |
meetings or in meetups like the southern fried dna meetup but um and maybe even from you know other |
| 26:21 |
other venues and conferences and stuff like that but unless you were literally there or watching the chat or |
| 26:26 |
you were in the slack group that we were talking about it or something like that it's really easy to kind of kind of miss |
| 26:32 |
some details so i wanted to highlight um three specific projects that |
| 26:39 |
they're they're different but they're connected and they're connected in cool ways |
| 26:44 |
so there's multiple reasons to to really highlight these |
| 26:49 |
one they're all related to dnn platform eventually in some shape form or fashion |
| 26:55 |
so it it's good to know what is potentially coming you know in the future |
| 27:02 |
as it relates to dnn platform the other reason is is there's just some really |
| 27:08 |
cool things that are happening one because of community managers that are willing to give of their time and |
| 27:15 |
efforts to really do these type of projects because they're not trivial |
| 27:21 |
by any means and we're talking about you know hours upon hours and hours and hours of you know working on these |
| 27:27 |
things some of it's really fun but some of it's not so fun you know |
| 27:32 |
when it gets to the into the nitty-gritty details of some of these things so that's another purpose for |
| 27:38 |
sharing this just to highlight some of the community members that are working on these the third reason is because |
| 27:45 |
i wanted to show the power of sponsorship um |
| 27:50 |
ryan mentioned earlier about um i can't remember if we were on air at that point or if we weren't but um |
| 27:58 |
you were talking about something that you had well actually you're going to talk about it here at the end i think just a little bit yeah i'll towards the |
| 28:04 |
end i'll be trying to grab some excitement about it yeah but in passing he was mentioning something about you know |
| 28:10 |
something that he and his company have recently uh tried to help sponsor and you know and some of the cool things |
| 28:16 |
that are happening from that so you know just bringing awareness that a lot of people might not even know that you can |
| 28:21 |
even do this type of thing i know we've talked about it in other mediums but again this is just kind of be purposeful |
| 28:27 |
and talk about these things so the first thing that i wanted to highlight here and daniel |
| 28:34 |
valadis is going to help me with some of this because he is involved in it um |
| 28:39 |
there has been an initiative for i don't know how long has this been going on uh daniel for maybe a little over a year |
| 28:47 |
now maybe a year and a half or so that you've been working on some of these |
| 28:52 |
it's been it's been at least two years i mean if you click on the commits and you go to |
| 28:57 |
the last page you should get a clue yeah it's a good point um |
| 29:02 |
a long time so that's that's that's that's that's the point i can dig for it |
| 29:08 |
see if i can get to the end here real quickly i think it's going to take a little while i'll do older older |
| 29:14 |
wow it has been a long time |
| 29:20 |
a really long time okay so while i'm trying to get to the end i'll i'll go ahead and start talking a little |
| 29:27 |
bit about this project what this project is it just recently showed up on the dnn community github |
| 29:34 |
org and up until this happened just a few days ago daniel |
| 29:40 |
was able to get it moved over to the dna community or on github just to get a little bit more visibility because it's |
| 29:46 |
now to the point where it's a lot easier for people to to look at it and understand a |
| 29:51 |
little bit more about what it's about and why it's important and so forth so it's really just seemed like the right |
| 29:57 |
time to kind of bring it to light but it's been in uh one of his repos for for |
| 30:04 |
time you know for that two years and a half two and a half years wow so |
| 30:09 |
the the way that this project started was there is a desire |
| 30:15 |
among the technology group to |
| 30:20 |
try to remove as many external dependencies to dnn platform as possible |
| 30:28 |
and the things that we're kind of talking about are things that are you know like |
| 30:34 |
an example of a dependency would be if you were building a theme and you were |
| 30:40 |
relying on a css framework like bootstrap or tailwind css that would be |
| 30:46 |
a dependency that you're bringing into your project something like that's much easier to |
| 30:53 |
manage when it's on a single project for you know a single solution for a single |
| 30:59 |
project and so forth and it's there as a tool to help you get to the solution a |
| 31:04 |
whole lot quicker and maintaining it's not that difficult because you're just kind of |
| 31:09 |
keeping things going along chances are you're going to build a website that client's going to not really maintain it |
| 31:16 |
moving forward if they do it's not going to be a ton of work to maintain bootstrap's dependency or tailwind's |
| 31:22 |
dependency on it so it's it's a little bit easier in that regard but when you get to a project of |
| 31:28 |
the scale and magnitude of dnm platform all these little dependencies |
| 31:34 |
some of them are interdependent on other dependencies and all this and it becomes astronomically |
| 31:41 |
difficult and complex to maintain these dependencies some examples of where we get into you know dependency |
| 31:48 |
problems or like the persona bar for instance if most of it's built using react |
| 31:55 |
react is a framework you know for javascript essentially right |
| 32:00 |
to be able to build these components that are that you see in the persona bar |
| 32:07 |
modules and i don't want to talk too long about this but i really want to set this set |
| 32:12 |
the stage for what this is all about anytime react bumps up which is all the |
| 32:18 |
time like it's every other day there's a new release of react and there's a tons |
| 32:23 |
of other dependencies that go along with some of these modules well it's not as simple as just bumping |
| 32:29 |
a version number ending in platform right daniel i mean sometimes it is |
| 32:34 |
we're talking about hours and hours and hours of work just to bump up to the next minor version much less a major |
| 32:40 |
version we went through an effort i guess probably what three years ago |
| 32:45 |
now or so where it bumped a major version of react and it took three of us |
| 32:51 |
working multiple weeks to try to just get through the mess that |
| 32:57 |
that caused and the yeah because it had not been maintained well for a long time and we really |
| 33:02 |
needed to get get things moving forward and honestly if we're being really honest we're still |
| 33:08 |
not doing a great job at you know maintaining those dependencies is just a lot of work |
| 33:14 |
so sorry to bring all that full circle the reason that this come about is the desire to remove some of those |
| 33:21 |
dependencies and something that is i mean relatively new over the last five |
| 33:26 |
years four or five years is this concept of web components and you've probably heard people talking about it but web |
| 33:32 |
components are part of and we that's kind of loosely and generically used a lot of times to |
| 33:38 |
describe things like custom elements which are really just custom html tags |
| 33:45 |
you know so just like you use an image tag in html you could use custom dash |
| 33:50 |
image and you could have a custom image element you know that you can use just like html |
| 33:57 |
and the desire to really build web components that could then |
| 34:03 |
eventually start replacing some of these other components that are more |
| 34:09 |
framework dependent like react components and things like that or web forms type |
| 34:15 |
solutions that are really tied to the um to the def framework you know there's |
| 34:22 |
there's ways that you can do it from a pure html standpoint so web components are standards based |
| 34:28 |
they're part of the html spec it's not something that you have to go |
| 34:34 |
and pull in some library or some framework to be able to leverage web components it's just html and javascript |
| 34:41 |
and css so this project was birthed out of that desire to help remove some of these |
| 34:48 |
dependencies moving forward so enough about that i just wanted to kind of set the stage for what this is so this is a |
| 34:54 |
collection or a library if you will not in the sense of a dependency but a |
| 34:59 |
library is a collection of components that'll eventually be able to be used well actually can already be |
| 35:06 |
used if you wanted to in your own projects but eventually they will be used in dnn to start replacing some of |
| 35:13 |
these things so let me pull up a demo site if you guys see the consumers here or because of the |
| 35:21 |
move they disappeared i think we have to go to npm to see the consumers of this wouldn't we it used to |
| 35:28 |
show on the right part of github to depend the packages that depend on this |
| 35:34 |
one oh it doesn't show here okay never mind but it's been used in over |
| 35:40 |
40 something other projects so it's battle tested yeah it's um it's it's really stellar |
| 35:47 |
what what's been done in and daniel viladas has built most of these himself from scratch so i want to highlight his |
| 35:54 |
stuff and daniel do you want to kind of walk us through this and tell me what to what to do i mean what you've got |
| 35:59 |
sure so um can someone also throw in an uh overview of what is stencil or |
| 36:07 |
what uh stencil yeah one term i don't know so stencil is not a framework it's a build tool in order |
| 36:14 |
to generate standard compliant web components so there's no framework there's no run time with this right it's |
| 36:21 |
a helper to get you started quicker on building |
| 36:26 |
components which was all of my talk at summit so if you were there and you want to rewatch the |
| 36:34 |
the presentation i actually go through building the first component on this |
| 36:39 |
demo page in details yeah but you don't need stencil if |
| 36:45 |
you're going to consume them you could put this into an html module and it would work anywhere where you can put an |
| 36:51 |
html element which is pretty cool so these are examples that he has put |
| 36:57 |
together of actually using them so really this is just html out here this is just using these components it's a |
| 37:03 |
static site it doesn't depend on dnn the goal of making dnn |
| 37:11 |
named ones is that they would consume a set of css variables that eventually in |
| 37:16 |
dnn will be customizable so you can actually brand having a couple of primary secondary |
| 37:22 |
callers and all the ui elements if you use this will |
| 37:28 |
work with that you know yeah and i'll say two before he gets into it too deeply here is that |
| 37:34 |
don't focus so much on the look and feel of things you know stuff because this is this is bare bones and it's right these |
| 37:41 |
are functional elements yeah yeah exactly so you can actually do whatever you want |
| 37:46 |
to with them you know and make them look certain way and they'll evolve in their base look over time as well but |
| 37:52 |
you know that's easy way to get distracted when you look at these at the beginning it's like it's like well that's ugly i wouldn't want to use that |
| 37:58 |
or whatever you know i mean or maybe you think it's great so one one example of that is like right now |
| 38:04 |
they have a three pixels rounding but it's a variable so if you decide you want your things square you can set that |
| 38:11 |
css variable to zero and not only the button but all the ui elements they're not going to look square you know if you |
| 38:17 |
want them hugely rounded you can just change that css variable same for the branding colors right so if |
| 38:24 |
you want green or purple or pink then it's going to affect all the controls so everything is going to |
| 38:30 |
look in harmony you know when you get there there you go so see the controls radius |
| 38:37 |
if you change that to i don't know 15 or to zero it just affects everything |
| 38:45 |
well maybe not the check boxes those are square all right i just realized i was muted |
| 38:51 |
yeah every every button is changing as i'm changing that that that radius there you'll see |
| 38:56 |
all these are changing same if your branding colors are different you can just go change the tnn |
| 39:02 |
color primary to purple or whatever you feel and it's going to affect all the controls |
| 39:08 |
and that's true wherever you consume this so that could be in a team that could be in a module that could be in |
| 39:14 |
dnn owns controls that's the goal of the project |
| 39:20 |
yeah so i know you probably don't want to spend a ton of time here but you can just see that there's button you can you |
| 39:26 |
know button element there's a checkbox element that has the checkbox kind of |
| 39:31 |
feature with labels you got modal experiences here you've got |
| 39:37 |
all this and this is all pure you know pure html javascript and css |
| 39:43 |
not even jquery or anything so there's the models you see the check boxes i can run you to what's different |
| 39:50 |
than regular controls quickly on the check boxes we have a three state check box the second column so that's pretty |
| 39:56 |
cool because there's no html element that does this out of the box it could be used anywhere |
| 40:02 |
the models like you said though they don't rely on any framework then we have the collapsibles which are |
| 40:09 |
nestable so very very quickly without writing a single line of code you just wrap dnn collapsibles and they're gonna |
| 40:16 |
update with their contents automatically either you expand or collapse them |
| 40:21 |
they're just gonna update the animation is a bit slow here but uh then we have more of a |
| 40:29 |
they don't do anything special except the bounce the typing and having a style of a search box |
| 40:35 |
but you just put a dnn search box there you don't have to mess with icons you don't have to mess with the behavior of |
| 40:40 |
clearing what's there super simple uh the color pickers these exist in most |
| 40:48 |
browsers but not all the browsers and they all look very different from browser to browser so now here we have a |
| 40:55 |
color picker that's actually the same no matter what device you're on and that's going to be used by the way |
| 41:02 |
in the persona bar as the way to customize those colors so a |
| 41:07 |
a host or an admin or depending what we decide to go with uh permissions for this could without knowledge of css just |
| 41:14 |
go customize the branding colors and notice i'm moving this without my |
| 41:20 |
cursor i'm actually using the keyboard uh to to move this so that's true for all the controls |
| 41:27 |
they're all usable without a mouse so daniel i've got a question um |
| 41:33 |
these aren't reliant on dnn either no uh the only thing that's specific to |
| 41:39 |
dnn are the css variables right there they're named dnn you could take this and do whatever on a non-dnn project |
| 41:46 |
they would still work until we get into connected components |
| 41:51 |
and so to use this you couldn't just go to create a html |
| 41:58 |
pane on a page and put one of these in without um you basically you have to |
| 42:04 |
create your own extension uh for now yes when this gets into dnn it's |
| 42:10 |
gonna just be available it's gonna be ambient okay and then what happens if you go |
| 42:16 |
into edit mode do you have the ability to um change settings or |
| 42:21 |
make other changes that the user wouldn't see well these are just |
| 42:28 |
html elements so if you want to have a different behavior logged in or not that's going to be your implementation |
| 42:34 |
so an example if you were using the quick edit features or something like that and you wanted to build your own |
| 42:39 |
with these web components then you can do that okay so it's really whatever you |
| 42:45 |
want to do you can think of this like like a paragraph element like a html button |
| 42:52 |
element it's just they they get styled by the ambient dnn variables and they have a bit of a different behavior than |
| 42:59 |
the stock elements |
| 43:05 |
sorry i had to reload there my camera was jittering a little bit |
| 43:11 |
yep so you got your check buttons disabled you know uh toggle i'm sorry toggles |
| 43:16 |
uh drawing you see the green here is not in the theme colors so every single element you can also customize the color |
| 43:22 |
if you don't want it to take the global ones |
| 43:28 |
you'll notice that these are using most of them are using the shadow dom which is you know just a way to |
| 43:35 |
encapsulate its features and usability so you can't |
| 43:40 |
do you know everything's encapsulated so including its style and so forth but that doesn't mean you can't change its |
| 43:47 |
styling necessarily it's just that you can only do what the component allows you to do |
| 43:52 |
you know either through a property or through um some state variable or something that you set with it or so |
| 43:59 |
forth so which is awesome to prevent like a team to break your module because |
| 44:05 |
you have the same css classes so it's it's isolated from the ambient normal css and you have to you can just |
| 44:13 |
customize the variables made available for it |
| 44:18 |
so this one here has you know a particular class on it that allows you to style |
| 44:26 |
those css variables that are used inside of the the component itself |
| 44:33 |
um a drop zone where being able to drop a file and you know upload that or take |
| 44:39 |
a picture um i won't show the take a picture uh functionality because i would have turned off well i guess i could |
| 44:45 |
turn off my camera and show you let's see i'll do that and then i'm going to allow it because |
| 44:51 |
this is a browser feature uh this native in the browser and there's my video |
| 45:00 |
wow this one yeah that's really big i need to get yeah i just noticed that my webcam doesn't give such a big image so |
| 45:08 |
yeah that would be something to fix yep it's probably my uh yeah it's huge |
| 45:14 |
you have such a great camera david |
| 45:21 |
the quality of the picture is excellent yeah so yeah that's something i need to fix |
| 45:28 |
to put a maximum width because uh yeah that's unusable that way david let us know if you want us to |
| 45:33 |
diagnose that skin condition oh man |
| 45:40 |
that's what that's what you get for trying to do something uh not that second one that second one is |
| 45:46 |
very fun because this one you can take a picture or upload a picture it doesn't touch the server it's in the |
| 45:52 |
browser and you can crop it and you can give the component the final size that |
| 45:58 |
you want as its properties and it's going to actually crop and resize the picture to what you |
| 46:05 |
want to upload in the browser so the big picture now doesn't even touch the server |
| 46:12 |
yeah i need to make this with the maximum width because the button is going to be well actually i don't have a |
| 46:17 |
button here but in your implementation you would put a button and that would crop and upload just what you selected |
| 46:23 |
here with compression in the browser that you can adjust also |
| 46:30 |
pretty powerful that's phenomenal to see |
| 46:35 |
we've actually used this in custom modules quite a bit already |
| 46:41 |
especially daniel i've done a lot of these being able to do it |
| 46:47 |
some some tab functionality this one's really fun an actual tree |
| 46:52 |
view and this was a huge one this was a recent one and i and i'll i'll mention this because this is uh |
| 47:02 |
it's a cool component very complicated but |
| 47:07 |
this was actually a result of a client |
| 47:12 |
of somebody in the community of mitch sellers and iowa computer gurus they |
| 47:17 |
actually needed something for their project they weren't even thinking about web |
| 47:23 |
components and we were able to turn that into a sponsored |
| 47:30 |
improvement to this project which could then in turn be used in that custom |
| 47:35 |
project you know i'm just bringing light to this because like this stuff can happen like |
| 47:40 |
if you have a need for something you know if your client has a need for something be thinking about it |
| 47:46 |
um you know sponsorship because the reason that works so well is a lot of times you know i mean different people |
| 47:52 |
have different models for you know sponsored improvements but i know for stuff like this we would typically |
| 47:59 |
charge half of what we would normally charge because it's going to help the open source project as well as those of |
| 48:05 |
us that are already using it right so just charging the client half of what the normal rate would be is really nice |
| 48:11 |
savings for them and it's helping the community so this kind of thing can really really help |
| 48:18 |
on a side note about the tree view component this was the main missing block in order to replace telerik in the |
| 48:25 |
faq model so because there was been a contribution here now we can take this and i'll soon |
| 48:32 |
be touching again the faq module uh that was my main blocker that would have taken a lot of hours to do |
| 48:39 |
for free so if since someone sponsored this everybody benefit benefits from it |
| 48:46 |
it's kind of cool because you don't see those kind of or hear much about those kind of conversations that are out there |
| 48:52 |
but this is the kind of mentality that we can have as as developers or integrators to be thinking |
| 48:59 |
okay is this an opportunity for sponsorship here because like everybody wins in a sponsorship you know situation |
| 49:06 |
developer gets a little encouragement monetarily to do something sure it doesn't pay the standard rate or |
| 49:12 |
whatever but it's like they want to do it anyways you know so it's a great opportunity for the client for the |
| 49:18 |
developer for the community at large as long as it's something multi-purpose the developer gains from having it you |
| 49:25 |
know yeah so um kind of take a mental impression |
| 49:32 |
of these two components because we're going to circle back to those in just a minute well and this one as well yeah so |
| 49:38 |
we're going to circle back that into a minute but this one is a kind of a split view type component where you can have something |
| 49:44 |
on the left and something on the right and collapse or also if you just click the button |
| 49:52 |
and do that and then this is kind of your foundation for building a toolbar you know or something |
| 49:58 |
like that so uh we'll circle back that so to show the toolbar you would have to |
| 50:04 |
resize it smaller than the button it contains |
| 50:10 |
and when you're gonna get to a certain size well what doesn't fit will get into a more menu |
| 50:16 |
and if you expand it it gets out of there i i was going to ask because i noticed |
| 50:22 |
that one of the labels on this project was called the dnn vertical overflow menu and i thought that was both an |
| 50:28 |
exceptionally specific title but also something i didn't recognize so i was going to ask |
| 50:34 |
about that yeah so there is your overflow menu right here right yes |
| 50:40 |
it'll automatically inject take those out of the main you |
| 50:46 |
know view so this is a great solution for responsive toolbars you know being able to pull them right |
| 50:52 |
back out of that contextual more you know even for a even for the website menu because what |
| 50:59 |
you put here could be anything so even for the website menu this could be used now one thing that's super interesting |
| 51:05 |
if you're using bootstrap or just css you have to rely on the viewport size |
| 51:11 |
well in here it's about the component size so it's going to be responsive to the |
| 51:17 |
component no matter how wide your pages so if this is a block of content |
| 51:23 |
that occupies half the screen it still works responsibly |
| 51:29 |
and you know one of the things in like frameworks and stuff you know you know you change the |
| 51:35 |
size of something you find out you have to refresh in order to get it to behave properly well you don't have those kind of things |
| 51:42 |
usually with this because everything is responding to the dom like |
| 51:47 |
natively close to the metal i don't know if i'm wording that just right but you don't end up with some of |
| 51:54 |
those weird idiosyncrasies that you do with some frameworks when you're depending on that for responsive |
| 51:59 |
behavior okay so that that took a little bit longer than i anticipated but i think it |
| 52:05 |
was work time well spent because it it brings to light you know both |
| 52:11 |
sponsorship capability you know opportunities and just kind of having that menthol mentality |
| 52:17 |
as well as just you know thinking of things more in a component fashion so you can probably already see how a lot |
| 52:22 |
of this stuff could be used to start replacing some of those things in in dnn already and that's the more |
| 52:29 |
long-term plan for version 10 of dnn |
| 52:34 |
okay so the next project is is may feel like it's completely different |
| 52:40 |
you may have heard us talk a little bit about it so i won't spend a lot of time on it but this is the dnn structure |
| 52:46 |
content initiative that's this could potentially make its way into |
| 52:52 |
dnn at some point once it gets to to that point a lot of the |
| 52:58 |
foundation has been laid already with this project and it's it's a structure content solution that is |
| 53:05 |
actually different from any other structured content solution out there right now that we have in this community |
| 53:11 |
it's architected differently it's really clean really easy to understand and wrap your head around |
| 53:18 |
and now it's in the stage of well the foundation's been laid the front end was initially built |
| 53:26 |
well actually this whole solution was initially built by jay mathis which many of you know in the community it was kind |
| 53:32 |
of a he he went on a kick about structured content he did a bunch of research in a |
| 53:37 |
bunch of different uh communities not just dnn and looked at different structure content solutions what were |
| 53:44 |
the pros and cons of various things they did and he circled back to this architecture and it was really quite |
| 53:51 |
solid it was really brilliantly put together the foundation was really solid and |
| 53:57 |
that was presented to the technology team for dnn and long story short it kind of became a mini project or a |
| 54:03 |
special project if you will to where now let's start looking at what it would |
| 54:08 |
take to to take the prototype and i'll call it a prototype because it really was kind of |
| 54:14 |
fleshing out the ideas and the the that jay had in some of his learnings from his findings |
| 54:20 |
and really try to refine that to a point to where it could potentially be incorporated into dna as |
| 54:27 |
a first class citizen you know an option within dnn to really be able to do structure content out of the box |
| 54:33 |
so it's at the point where the back end and stuff is really solid at this point but the front end was built |
| 54:39 |
in angularjs by angularjs i don't mean angular i really mean the very first version of |
| 54:46 |
angular which is quite old we're at angular 13 now just to give you a point of reference |
| 54:53 |
angular 1 which is angularjs was a complete paradigm shift from angular 1 to angular |
| 55:00 |
2 it was a complete rewrite so it's almost like it was a different thing altogether |
| 55:05 |
used access what he knows that's what it was comfortable him he could really flesh things out very quickly in the ui |
| 55:12 |
so the reason that this relates to the dnn elements project and the greater |
| 55:17 |
kind of goal of this is we're at the stage of now defining what components we might would need in order to replace |
| 55:24 |
those angular js i'll use the word components not really |
| 55:29 |
components but more directives in that language um try to replace some |
| 55:35 |
of those with these dnn elements and rebuild this ui using those web components so that's |
| 55:42 |
kind of where this project is is at so again we're excited because the the |
| 55:48 |
it may look like it stalled for a while and it kind of did sort of but it wasn't really stalled it was just really |
| 55:54 |
getting some of these more elements ready you know for it so that we could start using it and start |
| 56:00 |
defining what we need specifically for this so that's really the next phase of this one so you might want to keep an eye out |
| 56:07 |
on this one be sure to star these projects out there because that really kind of helps with the visibility on github |
| 56:13 |
as well as you might want to watch some of these so that you get notified whenever there's changes and stuff going |
| 56:19 |
on with it david who's working on on that project yeah i probably failed to mention that |
| 56:26 |
didn't i so jay mathis was was the kind of the original uh person on this and he's still very |
| 56:32 |
much involved and he's done a lot of the the back end changes that needed to be made to really kind of hone in on the |
| 56:39 |
security and stuff like that daniel vladis helped a lot with those changes on on all that |
| 56:45 |
i've been working on it some but i'm going to try to shift more towards the front end of this because i know angularjs and |
| 56:53 |
trying to help bridge the gap there a little bit and daniel is very versed in building front-ends using the web |
| 56:59 |
components as well so we'll probably tag team a lot of that kind of kind of effort |
| 57:04 |
that'll be a learning point for for jay in this too so that's another benefit of these collaborative efforts is a lot of |
| 57:11 |
times we'll get on co-coding sessions you know and you can't help but to learn |
| 57:16 |
you know a great deal about some of this so anytime anybody wants to join in and learn some of these things that we're |
| 57:22 |
doing feel free you know sometimes it's uh slow moving but |
| 57:27 |
that's enough that's why i asked is i've been spending a fair amount of time the last year |
| 57:33 |
learning angular and uh so i may be able to help i don't know |
| 57:39 |
but okay you can go offline with that yeah the the whole thing is built in |
| 57:44 |
angularjs you know right now the front end so this folder here with the app |
| 57:51 |
folder is the angularjs you know front-end app of this but um |
| 57:57 |
we'll be replacing all of this with pure web components and typescript and |
| 58:04 |
using the web api in the backend end's already basically done there's a |
| 58:09 |
little bit of work here and there they'll probably be refined over time but it's pretty much done so it's really |
| 58:14 |
just rebuilding the ui so that brings us to |
| 58:20 |
an incredibly exciting project that recently launched actually |
| 58:26 |
it's been talked about for a long time and people have expressed frustration |
| 58:31 |
about it and there was a miniature effort to help us with the initiative to get telerik |
| 58:40 |
removal as an option in dnn what i'm talking about is the file |
| 58:45 |
manager or resource manager that's in dnn so just a quick history |
| 58:52 |
lesson in that is that the the old file manager was heavily |
| 58:57 |
telerik based and that was preventing us from being able to have an option of removing |
| 59:05 |
telrick in dnns so a new file manager had to be built |
| 59:10 |
we looked at a lot of different options for that and ultimately the ending corp |
| 59:16 |
um donated i guess you could say a |
| 59:23 |
a project um for a starting point starting point |
| 59:29 |
yeah it was a starting point it really wasn't functional fully at that point so |
| 59:35 |
a lot of work had to go into just getting it to work |
| 59:41 |
you know and do the base amount of things that |
| 59:46 |
could do so that effort happened it was not a perfect little project and |
| 59:54 |
none of us want to touch that project anymore because |
| 1:00:00 |
you know we know there's problems in there but the amount of time and effort it took just to get it to the state that |
| 1:00:06 |
it's in right now was was ridiculous um it really should not be that hard to to |
| 1:00:11 |
work with a project but it really was so that's why things haven't really been improved we all know there needs to be a |
| 1:00:18 |
list view we all know there's some deficiency in some of the features uh there it's just not as simple as it |
| 1:00:24 |
would that now jeremy you could probably attest to this because you rolled up your sleeves |
| 1:00:29 |
and decided to go in and see what you could do within within that context do you have |
| 1:00:35 |
any commentary on this i spent a weekend on it with daniel's |
| 1:00:42 |
health and a lot of learning and stuff and honestly the biggest roadblock of all for me was just |
| 1:00:49 |
the ancient version of redux and and also i i personally have a ocd |
| 1:00:57 |
problem there were so many dependencies that were four plus years out of date it |
| 1:01:03 |
was just an obstruction to working productively so i mean that's one aspect to it and |
| 1:01:09 |
then the way things were constructed was also triggering me |
| 1:01:15 |
like i don't know if you or daniel remember but i was completely wigged out by the hard-coded |
| 1:01:20 |
pathing to the existing react components |
| 1:01:26 |
um inside the dnn project i mean they weren't even pulled in in a |
| 1:01:31 |
in a valid way you literally just suddenly had a checkbox |
| 1:01:38 |
taft up four folders down three more folders and yanking a |
| 1:01:43 |
jsx or a tsx file into the generated part of the project |
| 1:01:48 |
and i'm like what the heck just happened and it was it was nuts so anyhow |
| 1:01:54 |
um i'm probably already off topic from what you asked me but it was an interesting nightmare to play |
| 1:02:01 |
with and i feel like i got pretty far but two weeks later i uh |
| 1:02:08 |
imploded my development machine so [Laughter] yeah you know |
| 1:02:15 |
the part of that project that is not so difficult is really the things that you know is old school dnn here you know |
| 1:02:22 |
with the web api stuff and the the the web forms controls and things like that it's really when you get into the front |
| 1:02:28 |
end project itself that things start to go awry um when it's built i never had a problem |
| 1:02:35 |
with the back end part the front end part though was a contraption to say the least |
| 1:02:42 |
yeah and this is uh this is actually a decent example of the way most of the |
| 1:02:47 |
persona bar modules are done as well so this is not a new |
| 1:02:53 |
finding you know from us this is not just the the bastardized project you know that's over |
| 1:02:59 |
here that's not easy to work with no actually most of the persona bar modules are like this as |
| 1:03:04 |
well and redux brings in you know a level of complexity that is just kind |
| 1:03:11 |
of hard so anyways without be laboring too much into that you know all the requests and stuff for improvements in |
| 1:03:17 |
here are not trivial to to make and jeremy actually kind of started this because like in in one way |
| 1:03:24 |
because he was willing to jump in and try to fix some of the ux issues and some of the things like that you know |
| 1:03:29 |
and try to take a stab at it and you know you could look at it as that |
| 1:03:35 |
was wasted effort or whatever because it never was drawn to completion but i don't like to look at it that way |
| 1:03:41 |
because it was a learning experience for one but it was also too something to |
| 1:03:46 |
motivate others to really be be involved in this anyways i'm kind of drawing this out a little bit |
| 1:03:53 |
i'd like to take credit for being the key early complainer when the project came around |
| 1:03:59 |
and you know that's important to do that because like we all as users of |
| 1:04:04 |
this amazing platform need our voices to be heard you know of what what are the pain points you know and things that are |
| 1:04:11 |
needed in here because you just never know you know who is able and willing to do a certain |
| 1:04:18 |
aspect of it so it it's good it's all good in that regard |
| 1:04:23 |
so let me bring up what happened at dnn summit um we were pretty close to the |
| 1:04:29 |
end of the to the event and we were doing the closing session |
| 1:04:36 |
kind of a q a panel and mitch sellers kind of dropped a gauntlet a bit and |
| 1:04:42 |
said listen i'll throw out two thousand dollars to anybody that's willing to work on this problem right |
| 1:04:49 |
i mean that's two thousand dollars right it's not can you really rebuild this thing you |
| 1:04:55 |
know from scratch for two thousand dollars no there's there's no way um that's not enough you know because it's |
| 1:05:01 |
gonna be more time involved than that but okay that's different than buying somebody a coffee right |
| 1:05:09 |
or five cups of coffee that was a serious plea for help you know from anybody that |
| 1:05:17 |
was willing and interested and had time you know to to do something like this so |
| 1:05:22 |
that actually sparked um a conversation and eventually a |
| 1:05:28 |
project a mini project has been formed uh to really start this effort and it's |
| 1:05:34 |
kind of back to that model that i was talking about earlier when when there's opportunities for sponsorship |
| 1:05:41 |
maybe you don't have the money to pay for the whole freaking thing you know but sometimes a little motivation i mean two |
| 1:05:47 |
thousand dollars might sound like a lot but let's just work that out in hours wise let's say you make 150 bucks an |
| 1:05:52 |
hour well you can do the math that's probably not enough to cover what it's going to cost you know in time to |
| 1:05:58 |
actually develop something like this but it's a huge motivator so it's an opportunity to |
| 1:06:04 |
to kind of split the difference with some things and and you know mitch i'm sure would probably go and talk to a few |
| 1:06:10 |
of his clients that have been asking for this kind of thing and be able to get contributions from them on this as well |
| 1:06:16 |
so it was a great catalyst to be able to start this effort daniel vilatis has |
| 1:06:22 |
started putting together and this is a a design rendering if you will of this |
| 1:06:28 |
enfigma of a new from scratch file manager or resource manager |
| 1:06:35 |
whatever you want to look at it and daniel i don't want to steal your thunder on this at all if you want to |
| 1:06:41 |
explain some of the stuff that you're you were thinking about with this and kind of what the inspiration was behind |
| 1:06:47 |
this but to just connect the dots here this would all be you're probably |
| 1:06:53 |
recognizing a few things you know that were in the dna elements well guess what this will be built using |
| 1:07:01 |
okay take it away daniel yeah so exactly that so on the top bar there will be the dnn |
| 1:07:08 |
search box which is already built on the left we're gonna have the tree view which is already built |
| 1:07:13 |
on the gray menu where with the icons that's going to be the overflow menu which is already built so we already |
| 1:07:20 |
have all the lego pieces right and |
| 1:07:25 |
the back end of the the module that we have now is fine |
| 1:07:31 |
so the job here is just to hook this all up together and use those components and it's going to |
| 1:07:37 |
be a new battle test for them and if you go to the second image there well we're |
| 1:07:43 |
gonna see that depending on how many items are selected right so if you have one item selected |
| 1:07:50 |
the current implementation the previous implementation was based on having a mouse right so you would have |
| 1:07:57 |
to right click on items to do stuff so you couldn't do any file management on mobile |
| 1:08:02 |
the one that we have now you could but it's not made for mobile and the persona bar doesn't show on some break |
| 1:08:09 |
points and stuff and the mouse was totally forgotten right so |
| 1:08:14 |
it's a bit clunky now because you can't right click on items and have a context menu there's no reason you can have both |
| 1:08:20 |
right so on this new iteration if you have a mouse you can right click an item you |
| 1:08:26 |
have a context menu everything in the context menu is also on the top icons |
| 1:08:32 |
and the files have a way to to select one or multiple files so if the items |
| 1:08:39 |
don't all fit on the top bar we have our overflow menu and if we |
| 1:08:44 |
have more than one file selected which is the third slide there |
| 1:08:49 |
then you have less options and it fits in the menu but we can do batches of things right you want to |
| 1:08:55 |
delete 10 files you can pick them and delete them or move them and uh we're going to also add probably |
| 1:09:02 |
drag and drop here maybe not that this the first iteration but there's no reason you can pick three files and drag |
| 1:09:09 |
them over a folder and invoke the the move action or the copy action or ask the user what you |
| 1:09:15 |
want to do you want to copy your moves right so that's kind of the the mock-up and |
| 1:09:22 |
the left bar will be adjustable so if you need if you have long folder names |
| 1:09:27 |
you want to see more you can expand it if you don't you can have it smaller you can also dock it completely if you want |
| 1:09:33 |
to have more real state for the actual files so that's the overall concept inspired a |
| 1:09:40 |
little bit by various existing file management |
| 1:09:45 |
like onedrive and dropbox and like trying to take what's uh best of all those and make our own |
| 1:09:54 |
that's pretty exciting right i mean being able to see something like this evolve so quickly i mean daniel i know |
| 1:10:00 |
you're a beast you know but you were able to put together this mock-up |
| 1:10:05 |
sitting there watching him put together some of the things you know i mean he put it together really quickly you know on this uh because of the inspiration |
| 1:10:14 |
uh to be able to do some you know something like this from a project standpoint to be able to leverage web |
| 1:10:19 |
components in a more robust way and usable way but also you know just and to also drive improvement of those web |
| 1:10:26 |
components through need and use that will then once they're used more encourage others to use them more this |
| 1:10:32 |
is like a self-feeding growth improvement exactly |
| 1:10:38 |
so we notice a bug with one of the components and we fix that everybody benefits from that so |
| 1:10:46 |
yes i mean there's there's it's pretty cool i mean we're stoked about it it's going to be a lot of freaking work right |
| 1:10:53 |
you know but i i mean it would be able to keep up with daniel i mean he's been going so |
| 1:10:58 |
fast on this and he's already kind of built a couple of new components like um remember i told you to keep a few of |
| 1:11:05 |
these in mind but you know looking back over here at these you will see well there's your tree view stuff |
| 1:11:12 |
you know that's got to be used in this with maybe some advanced features at some point being able to to do some |
| 1:11:18 |
you know actions that are on folders and things like that this split bar view well there's there's |
| 1:11:25 |
your you know tree view over on the left and your files on the right you'll be able to collapse and expand |
| 1:11:31 |
um your overflow systems are really really cool how all |
| 1:11:36 |
this comes together you know and a lot of times it takes an actual project that's more of a solution or an |
| 1:11:43 |
application to inspire the underlying building blocks for that in in the web components |
| 1:11:49 |
but what do we need next we've been talking about web components for how long now i mean really ever since the |
| 1:11:55 |
inception and a lot of times i know when i've presented on the web components at the southern fried or some |
| 1:12:02 |
other thing you know a lot of times i'll get a glossed over look like what are you what are you talking about yeah i hear what you're saying but i just don't |
| 1:12:08 |
get it and it's it's not complicated but the problem is without seeing it in a in |
| 1:12:13 |
an actual application right it's really hard to connect the pieces but they're just building blocks |
| 1:12:19 |
but they're done in such a way that we don't have to pull in some external third-party library or framework to to |
| 1:12:25 |
do so it's all baked right into the to the html standard |
| 1:12:31 |
so very very cool stuff um ryan i know you were going to mention something too about the |
| 1:12:37 |
um a recent experience of yours and sponsorship so probably a good time to to chime in on that i'll stop sharing |
| 1:12:45 |
this going or if you want me to pull up anything um you know uh give me two seconds and |
| 1:12:50 |
i'll bring up a screen or two on that and uh and that'll be a good segue to to |
| 1:12:56 |
finish out let me just bring this one up i have a |
| 1:13:02 |
quick question about webcam the dnn elements if you don't mind oh |
| 1:13:09 |
yeah sure you're muted there jeremy |
| 1:13:18 |
talking just a second ago jeremy we can't hear you there we go sorry about that um so |
| 1:13:24 |
is is dnn elements written in a way that you can use it outside of dnn can you just use it anywhere |
| 1:13:31 |
currently yes because none of the components are tied into dnn apis or |
| 1:13:36 |
whatever they just um consume dnn named css variables at some point |
| 1:13:44 |
when we get into file management when we get into a permission grid or something |
| 1:13:49 |
there will be a set of dnn connected components so those are made really just for dnn |
| 1:13:56 |
and i plan on having those named differently like dnn connected |
| 1:14:01 |
something something or dnnc dash something something those ones you cannot use them |
| 1:14:07 |
standalone because they they rely on a dnn api in the backend their behavior right |
| 1:14:13 |
if you wanted to add or make new ones or is it just like take one of the existing ones and copy and paste or is there some |
| 1:14:21 |
kind of generator to scaffold everything out properly so it depends what you want to do i mean |
| 1:14:28 |
that the project is open source if you want to build a component |
| 1:14:33 |
can consume other components so one of the interesting one is the dnn |
| 1:14:39 |
button with a confirm so the confirm fires up a dialog and the dialog has |
| 1:14:44 |
buttons so the button one consumes the dialog one and the dialog one consumes |
| 1:14:50 |
the button one and it all just works so you can wrap them and have some |
| 1:14:55 |
inheritance and uh if you want to have something that's completely different you can copy |
| 1:15:00 |
it too yeah but uh were you at um |
| 1:15:05 |
summit did you register for summit yeah so i recommend you watch my presentation |
| 1:15:12 |
about web components because i actually build the dnn button here live so you have a good clue of how it works |
| 1:15:19 |
and you just don't have to set up you just clone this and go on with your lives just skip the setup part |
| 1:15:28 |
all right the video is queued up thank you awesome so you see uh david is showing it here so the dnn |
| 1:15:34 |
uh you are on the dnn button so the dnn button consumes the dnn model and the |
| 1:15:40 |
dnn model has dnn buttons inside of it or just reuse reviews we use |
| 1:15:46 |
yeah i think what one way to answer your question jeremy is a lot of times you know because you're working bare to you |
| 1:15:53 |
know close to the metal here it's just kind of philosophically how you approach with a component ground up |
| 1:16:00 |
is usually the best unless you're going to be leveraging other components in building a new component |
| 1:16:07 |
um yeah just kind of from the scratch i mean that stencil offers a lot of tooling |
| 1:16:13 |
as it relates to building these web components so there's some things that are that are scaffold if you will um |
| 1:16:21 |
like being able to have your component you know here your imports set up your slot well no that's something special |
| 1:16:28 |
there but documentation last set up but i mean you can see from this there's |
| 1:16:33 |
this may look daunting but there's really not much to it you know you've got a props you know all your people |
| 1:16:38 |
yeah no i've actually um i've actually built a few web components already so i get the whole thing what i |
| 1:16:44 |
was wondering about is is there more to the scaffolding than just what you see inside the |
| 1:16:51 |
source directory for the element for the component no not much and if you are familiar in the react world which you are |
| 1:16:58 |
a lot of the syntax used here is inspired by react and modern angular |
| 1:17:04 |
so someone who comes from this world into this there is a lot of similarities but you don't have a |
| 1:17:10 |
a runtime library under you but a lot of things got inspired you have jsx |
| 1:17:17 |
you have like the props and the state every time you change a proper estate that triggers a rerender |
| 1:17:24 |
there's a way to have a state tunnel there's nothing here for it because we don't have a global state you know every |
| 1:17:30 |
component just has its own state but uh as you'll see in the file manager we'll have a global |
| 1:17:37 |
state and it's really really not as complex as |
| 1:17:42 |
redux it's way simpler okay looking forward to it thank you yep |
| 1:17:49 |
and ping me up anytime if you want to hang out and work together because i'm going to be working on the file manager |
| 1:17:55 |
a couple hours per week for the next following weeks so uh happy to hang out |
| 1:18:00 |
and uh work together and he really doesn't mean a couple i don't i'm looking forward to it because |
| 1:18:06 |
here's my new development machine see it's that nice nice nice |
| 1:18:13 |
i don't even comprehend what that is |
| 1:18:18 |
that's a i5 32 gig of ram uh terabyte hard drive |
| 1:18:27 |
it's a nook he's gonna take it pretty massive computer |
| 1:18:36 |
not even all in one tiny unit like an old uh oqo |
| 1:18:41 |
was back from the day um so david i can share screen i'll bring this up |
| 1:18:53 |
i don't know if it's uh like it is here at your house i know you're right up the street there ryan but the wind is going |
| 1:18:59 |
crazy i'm surprised we haven't lost it yeah um you know we |
| 1:19:05 |
we had what um 40 degrees and 30 degrees just a day or two ago today was 70 and |
| 1:19:11 |
then tomorrow's gonna be 30 something degrees so i i'm expecting tornadoes and little dogs flying by the window and |
| 1:19:18 |
everything yeah if ryan and i disappear all of a sudden you'll know why the wind just possible |
| 1:19:25 |
um david you may need to stop screen sharing so i can call in screen share here we go i did stop screen sharing |
| 1:19:31 |
yeah yep yep i see now so um to kind of tie into what david was |
| 1:19:37 |
saying here um there were a few different conversations that talked about sponsorship and things that you |
| 1:19:43 |
can do in the dnn community to make things happen um it's not just about being a developer to |
| 1:19:50 |
get in there and work on the code it's fantastic if daniel and jeremy and david are able to get in there and |
| 1:19:57 |
make edits and changes and start working on making things better because they have the time and the knowledge and the |
| 1:20:02 |
ability but um you know my good buddy pete good |
| 1:20:08 |
mark myself several other people who are dna integrators we can still participate we |
| 1:20:14 |
can still be uh you know helping this move forward by supporting it and so one of the |
| 1:20:21 |
things that we talked about at cnn summits both in sessions and i spoke about for a few |
| 1:20:27 |
minutes in the keynote was the concept of how easy it is now especially with |
| 1:20:32 |
the new sponsor feature of github to be able to sponsor someone give them |
| 1:20:38 |
that cup of coffee to help boost them that afternoon or look into doing some either one time a |
| 1:20:45 |
one-off support payments or regular monthly payments so |
| 1:20:50 |
i thought i'd re-share some of those screens here this was part of the conversation where |
| 1:20:55 |
we were talking about all of the different dnn version releases and where we could use some help doing testing because as those |
| 1:21:03 |
uh beta releases are available they need testing within real fleshed out dna |
| 1:21:08 |
instances and uh that's you know definitely a place where people can help um but uh you know as part of the point |
| 1:21:14 |
of this slide talked about how there were uh you know 27 pull requests in a |
| 1:21:19 |
particular release this was 9.91 um by nine contributors so it's not a |
| 1:21:25 |
tremendous amount of different people involved but when you take a look at it in github |
| 1:21:30 |
you can go see who those people were and through the new features that are here in |
| 1:21:36 |
github you can very easily sponsor those those developers so you know here on |
| 1:21:43 |
screen i was showing that uh you know i hadn't sponsored which sellers yet i thought i can't believe i haven't |
| 1:21:49 |
sponsored him yet let me let me go and do this so that was part of the presentation was this is how easy this |
| 1:21:55 |
is if you've participated in uh kickstarter or you've put something |
| 1:22:00 |
into patreon or something you've done exactly the same amount of complexity as it takes to to get this done so going to |
| 1:22:07 |
mitch seller's developer page you can take a look at the different tiers or the different elements that are |
| 1:22:12 |
available and it can be as simple as saying you want to submit or contribute five dollars a month or 25 a month but |
| 1:22:19 |
it doesn't have to be a an ongoing regular commitment that's wonderful if it can be |
| 1:22:26 |
from a business standpoint i think how much the efforts that people are doing make a difference |
| 1:22:33 |
from my business can i look at it like you know buying an inexpensive module or two and like can i put in 50 bucks a |
| 1:22:39 |
month or 100 bucks a month yeah yeah i absolutely can especially with all of the help that we've been |
| 1:22:44 |
getting that's not a lot individually but if 10 of us 20 or 50 of us did that |
| 1:22:50 |
it would make a big difference to help support these these developers who are doing this uh on the regular but it also |
| 1:22:56 |
can be a one-time contribution so you can come in and click that one time button and make a contribution where you |
| 1:23:02 |
are then supporting you know one at a time uh so that uh you know led to me making |
| 1:23:09 |
a small sponsorship of daniel um because he's definitely helped out with a lot of the core |
| 1:23:16 |
dnn modules those older kind of left out in the cold modules that we still use |
| 1:23:21 |
from back in the day that iframe module man good grief still have that stuck onto a bunch of |
| 1:23:27 |
websites no matter how easy it is to make an iframe i need a user to be able to edit it i better put in that iframe module um so |
| 1:23:35 |
uh there's a lot of modules that are out there like that and we got to talking about things that are holding up |
| 1:23:41 |
individual dnn instances from removing telerik all the way and one of the ones that came up in a |
| 1:23:46 |
conversation was the faq module i said hey wait a minute i have several clients with that faq module i would absolutely |
| 1:23:53 |
love to remove telerik from those dna instances um how about daniel we uh we |
| 1:23:58 |
pitch in and help make that happen so i suggested that i could um jump in and make a small sponsorship for that um and |
| 1:24:06 |
contribute to that and i encouraged other people okay here is daniel's page on github |
| 1:24:12 |
can we all pitch in and uh you know give a little bit to help make these projects happen |
| 1:24:17 |
the faq module is small potatoes compared to something as important and |
| 1:24:23 |
impacting as the file manager so i think that |
| 1:24:29 |
it would be a wonderful thing if after dnn summit and after you know meetups like this |
| 1:24:34 |
we were to get two or three new people every week to start pitching in and supporting |
| 1:24:40 |
these developers who are making a big difference to the dna platform on an ongoing basis |
| 1:24:47 |
there we go that was the soapbox for 10 minutes yeah and to kind of bring that full |
| 1:24:53 |
circle back around to the faq module for those that don't know is the reason that one has not been updated |
| 1:25:01 |
is because it is so tightly tied to tell rick it is |
| 1:25:07 |
massively using telrick so it's one of those that has to be rewritten really is the best path |
| 1:25:14 |
forward for it so to connect the dots a little bit more the dnn elements project is going to be |
| 1:25:20 |
able to need this because guess what we need some of those components to be able to do these things |
| 1:25:26 |
so it's amazing how it all kind of works together um some of those expand and collapse exactly right so the |
| 1:25:32 |
collapsible and the tree view they're 90 of this module and they're built so now it's just like |
| 1:25:38 |
throwing out the front and then just redoing it the back end is fine so |
| 1:25:45 |
and daniel tried to look at this you know and finally determined that |
| 1:25:50 |
yeah that this thing needs to be rebuilt you know but it needs to be done in such a way though that people can actually |
| 1:25:57 |
upgrade from older versions so it still needs to keep the you know the parity of the the the back end especially on this |
| 1:26:05 |
the intent of the use of the back end elements yeah yeah but sort of make things more responsive make it based on the web |
| 1:26:13 |
components and dna elements that'd be fantastic yes this would be a good example project |
| 1:26:18 |
as that progresses to be able to see how that could be used in a standalone module and you know |
| 1:26:25 |
this will be a good test ground for another concept of web components which is html templates |
| 1:26:33 |
as you know there's a setting in this module that you can use tokens inside of your |
| 1:26:38 |
settings to template how the question and answers show up and that uses token replace |
| 1:26:45 |
so the concept has been there for ages but now there's a standard way of doing html |
| 1:26:51 |
templates with slots and this would be a good test ground to |
| 1:26:56 |
use it and to teach people here's the standard way of doing token replace |
| 1:27:04 |
and anybody any designer doing html will just create slots and those slots will |
| 1:27:10 |
have a meaning and dnn will inject the elements in those slots not even dnn the front-end component |
| 1:27:17 |
will inject what belongs where and do copies to do lists and stuff |
| 1:27:26 |
it's very cool i don't know what kind of timeline we'd be looking at for something like this but you know |
| 1:27:33 |
it's it's not a trivial project even rebuilding you know this way but it's really cool that people like you ryan |
| 1:27:39 |
will be able to sponsor you know and and kind of help motivate that along a bit and encourage the people that are |
| 1:27:46 |
developing on that so if you want to kind of see some example projects of these dnn elements being used this would |
| 1:27:52 |
be one to watch in the future be sure to star this one and and watch it change |
| 1:27:57 |
your watch settings on it another one that just recently got started that i've been talking about for at least two |
| 1:28:03 |
years now but just haven't had time to start doing is the the dnn user voice project which is also |
| 1:28:10 |
out on dna community there we got the initial module |
| 1:28:16 |
set up and there and it's building and functional but none of the features have been built out yet so the plan there is |
| 1:28:22 |
to start using some of the dnn elements to build out that functionality and hopefully that project will |
| 1:28:28 |
help feed more elements into the dna elements project so it kind of all just starts working really well together and |
| 1:28:36 |
standard space and less dependencies yay |
| 1:28:42 |
easier to keep things updated when you're making updates from one place and then um |
| 1:28:47 |
yes and comes along with it because the only dependency here is a build time dependency |
| 1:28:53 |
even if there's breaking changes or whatever what was built is built that's not going to break you know |
| 1:28:59 |
it's really developer tooling only yeah it's really interesting because we've we've had several projects that |
| 1:29:06 |
are that are that's using this model you know to create these these modules |
| 1:29:11 |
and when it becomes you know our lovely dependable day we like to call it you know when our dependency alerts come up |
| 1:29:18 |
and github and we need to go well we don't really dread those days with |
| 1:29:24 |
modules that are built on web components because it's build time dependencies that it's talking about and usually it's |
| 1:29:30 |
really just safe just to accept the automated pr from dependable and |
| 1:29:36 |
let it roll every once in a while we have to test something if it's a major version or you |
| 1:29:41 |
know some specific thing in a modern version but it usually it's not |
| 1:29:47 |
all of the build components have it but the ones that are more complex like the color picker |
| 1:29:52 |
they have ui tests written so basically if if the version bombs |
| 1:30:00 |
you just merge it if it builds it works because it's tested so you don't have a human clicking and |
| 1:30:06 |
making sure it expands and this and that the tests are written we don't have it on all the components |
| 1:30:12 |
it would be awesome but it's obviously very time consuming |
| 1:30:20 |
i can't help but laugh jeremy just um put my favorite question in the chat |
| 1:30:25 |
[Laughter] |
| 1:30:31 |
you're getting ready to start a a debate again yeah that's why i typed it instead of |
| 1:30:37 |
saying it's a crazy branding thing you know he was asking uh for those that aren't |
| 1:30:42 |
seeing the chat and watching the playback here what is the correct you know spelling or |
| 1:30:48 |
variation of d n n is it capital d capital n capital n or is it capital d |
| 1:30:54 |
lowercase n lowercase n and it's really a branding problem that was caused a |
| 1:31:00 |
long time ago by the new designers of the dnn logo they actually |
| 1:31:06 |
put lowercase in the thing that made them the size of the uppercase letter so you know |
| 1:31:14 |
it's this ongoing debate in the community yeah now we have a debate of what's uppercase because is it just the |
| 1:31:20 |
height of the letter or is it the shape of the letter that makes it uppercase yeah exactly oh goodness |
| 1:31:33 |
it's been fun to talk about some of these um things that aren't so you know |
| 1:31:38 |
laser focused on one thing so it's nice to nice to see the activity in the community and how things are working |
| 1:31:45 |
together um with those that are developers and those that are not and you know just all kind |
| 1:31:51 |
of blending together and motivating the other so really cool |
| 1:32:05 |
what was that cheryl i was saying the dnn elements look really interesting and i've done a little bit with uh reacting |
| 1:32:11 |
a little bit with angular so i definitely want to get in there and look at the code a little bit more |
| 1:32:16 |
so one of the points i didn't make with this is that if you are using a |
| 1:32:23 |
framework for your specific you know use case that's totally okay and you can actually use web components |
| 1:32:30 |
in that framework as well you don't have to just use angular components or react components you can actually use pure web |
| 1:32:36 |
components inside of react or inside of an angular project um so yeah because this is standard it's |
| 1:32:43 |
just html so you're responsible for how you wire that up you know with the |
| 1:32:49 |
events and so forth and each of those frameworks have their own patterns for doing you know that |
| 1:32:56 |
that as well so yeah let us know if you need any help once you look in there uh it's a lot of |
| 1:33:03 |
fun oh sorry i'm my mute was right there on |
| 1:33:09 |
top of my keyboard while i was typing sorry about that guys and uh stencil actually we're not using |
| 1:33:16 |
it right now but stencil has in its configuration different output targets so let's say |
| 1:33:23 |
there is interest on having react components from this it's just |
| 1:33:28 |
something to put in the config and there will be react components that use the standards one |
| 1:33:35 |
under the hood but with the react way of doing props and stuff so you don't even have to mess |
| 1:33:40 |
it up and you just use it as if it was a react component |
| 1:33:46 |
if there's interest we can add it to the build when did they do that daniel that's that uh |
| 1:33:52 |
it's been a couple versions so you can have output targets this is the standard one react and |
| 1:34:00 |
uh going to the docks hold on that's a significant improvement because i mean while you can use standard web |
| 1:34:07 |
components in those you know like i said each framework has its own way of kind of wiring things up and you would have |
| 1:34:12 |
to manually do that before but with what daniel's saying it sounds like they're actually outputting with that wiring |
| 1:34:18 |
kind of there if you want to go on your browser stencil js.com and you click on docs and you're going |
| 1:34:25 |
to see framework integration on the left menu |
| 1:34:31 |
i'll have to steal again from uh from ryan here so |
| 1:34:36 |
you know stencil js.com |
| 1:34:42 |
and docs and then on the left framework integration |
| 1:34:48 |
so just in the in the config let's say we go with the react one or |
| 1:34:54 |
any one of those let's take reactors it's very popular so you can just turn on the react |
| 1:34:59 |
target on the build config file and you will have a folder for react on top of |
| 1:35:04 |
the on well as a subfolder of the the distribution so it's going to do |
| 1:35:09 |
whatever it takes for this to be used as a react component and the same is available for vue.js |
| 1:35:16 |
angular amber a lot of popular frameworks they don't have to be custom built for |
| 1:35:22 |
those frameworks but this is going to handle the framework gotchas automatically so you don't have to deal |
| 1:35:29 |
with those that is fantastic um and |
| 1:35:35 |
not that we're doing a deep dive or anything but stencil jake is actually what the folks at ionic |
| 1:35:43 |
made in order to build the web components for ionic framework that they're that they |
| 1:35:49 |
use since version four so they're heavily invested in this there's a there's other ways that you can build |
| 1:35:55 |
web components out there and and those are fine too polymer was |
| 1:36:00 |
probably the first one that was on the scene with this but stencil js has really become |
| 1:36:06 |
just about the de facto standard for a lot of people for building low components because it's just so well thought out |
| 1:36:12 |
and a lot of nice stuff it automatically builds documentation i don't know if you |
| 1:36:18 |
still have the the replacement story open but if you go to one of the components like the readme |
| 1:36:25 |
of the folder i didn't write this documentation right it's it's my code auto generates this so |
| 1:36:32 |
you have automatically a markdown file that tells you what properties it supports what type that |
| 1:36:39 |
property is what's the default value if you don't specify it is it required |
| 1:36:44 |
same thing for the events the slots and that just comes from the code i didn't write any of this |
| 1:36:50 |
and this is new you see the graph here it used to be like not displaying this |
| 1:36:56 |
way but if you now go to let's say the modal or one of the more complex ones maybe |
| 1:37:01 |
the image cropper this is cool because github just added this recently |
| 1:37:08 |
uh the image cropper is uh yeah that you just passed it |
| 1:37:13 |
the image cropper is more complex even so if you have a more complex scenario if you scroll down you're gonna see the |
| 1:37:20 |
what depends on what on the components [Music] |
| 1:37:28 |
and that's generated with the dnn button and |
| 1:37:35 |
yeah probably yeah yeah it was referencing itself |
| 1:37:42 |
there we go so you know that if you touch the model right run the model |
| 1:37:48 |
we know that the dnn image cropper that relies on it so if you have like any thoughts about |
| 1:37:54 |
breaking changes okay and i need to make sure it works over there very cool |
| 1:38:01 |
and the links just above that brings you to the markdown of that component so |
| 1:38:06 |
it's pretty cool |
| 1:38:13 |
very very cool well ryan you want to close us out on this |
| 1:38:18 |
yeah i was going to say we kind of have a good natural uh uh wrap up for the meeting tonight and it's |
| 1:38:25 |
almost 8 30 so it's right on time a good time for us to mention that uh |
| 1:38:30 |
you know we meet the third thursday of every month and uh that makes it that march the third thursday |
| 1:38:37 |
is the 17th so that will be the next um meeting of dnn summit we have uh planned |
| 1:38:43 |
and currently i believe that we have uh helene planned |
| 1:38:48 |
to come talk with us in march so we're looking forward to that but if david hasn't mentioned in this |
| 1:38:57 |
uh southern fried instance uh he has mentioned recently we're trying to plan out the year so if you're interested in |
| 1:39:02 |
coming to speak present content and materials uh we'd love to talk to you and get our our uh schedule for the year |
| 1:39:09 |
planned out we'll also go fetch some of our favorite speakers and sessions from dnn summit and later from across the |
| 1:39:16 |
pond and get all those folks to come and talk with us too and present new and exciting information but we're we're |
| 1:39:22 |
setting up our year schedule now so come talk to us um i think that's it |
| 1:39:27 |
excited about helene's uh presentation next month because she'll be talking about something that's a lot of people are |
| 1:39:33 |
using but we've i don't know if we've ever had a session on it but it's about the members directory and the |
| 1:39:39 |
view profile modules in there and kind of how to how to leverage uh some of that within an |
| 1:39:45 |
organization built built-in power of dnn that sometimes goes unused yeah |
| 1:39:51 |
yeah excellent thank you very much everyone who was here with us tonight and thank you for |
| 1:39:57 |
everyone watching the recap online we will see you next month at southern fried dnn |
| 1:40:03 |
thanks very much |