On August 6, 2014 appendTo hosted an online conference called, "Modern Web Conf". All ran through GoTo Meeting, this conference's focus was on all things "Modern Web". There were two tracks, the first on August 6th called the Web Technologies Track, and the second on August 7th called the Developer Workflow Track.
The focus of day 1 was on sharpening your skills with the tools of the modern web, HTML, CSS, and JavaScript as well as any helper libraries or frameworks.
AppendTo's former CEO and current Director if its parent company Epic Creative Mike Hostetler gave the opening talk. His talk was about an MVC framework called sails.js. Sails is a framework for building web applications built on Node and shares many common architectural patterns with Ruby on Rails, hence the name, sails. He went on to demo some of sails' great features such as web socket and http based controller routes, the ORM waterline for easily creating a data layer as well as its asset pipeline. He also created a basic app showing off the power and ease of use it has similar to Rails.
The current president of the jQuery foundation Dave Methvin gave a talk that highlighted some of the features in jQuery that exist now by some questionable choices made in the past of jQuery. There were some really interesting features of jQuery talked about in this talk that he showed how to avoid, and really got into the nitty gritty of some older jQuery APIs.
A talk on working with Bootstrap was given by Bess Fernandez. She currently works as a front end developer for a company called Articulate. Her talk went straight into how to use bootstrap, one of the most popular HTML, CSS, and JavaScript frameworks around these days. Many people who were attending the conference who had not yet gotten a chance to see bootstrap were very impressed and expressed their desire to go check out bootstrap after having hear Bess introduce it.
Perhaps one of the most mind blowing talks of the day was given by one of appendTo's Visual Design Engineers, Trevan Hetzel. The talk titled, CSS Can do THAT?, clearly had every one watching reeling in awe of the things that CSS can do. He demo'd an entirely JavaScript-less page that used some amazing CSS hacks for doing things like page clicks, accordions, toggling content, and a navigation menu. It was pretty incredible to see what you can accomplish with nothing but CSS.
Doug Neiner who currently is the Vice President of Products at appendTo gave a talk on events and messaging strategies in JavaScript. Starting off with the basic forms of events, he then continued to get increasingly deeper into architecting sites with messaging and events in JavaScript. He mentioned some client side messaging libraries such as postal.js, and monologue.js that can help build complex decoupled applications in JavaScript by separating references to parts of the application. By separating different systems of an application and communicating with messages, it's possbily to create a maintainable and testable application.
Angular.js is arguably the most popular client side MVC framework around these days, so it's no surprise that it made a presence at Modern Web Conference as well. Burke Holland, who is a Developer Advocate at Telerik, gave a talk on Angular.js directives. Angular although popular definitely has its complicated parts, and Burke really helped add clarity to some of the "computer sciency" things in angular like scope, transclusion, and many others. His demos on creating reusable directives really inspired the viewers and clearly showed how powerful angular can be once you get passed its initial learning curve. Burke is a great speaker and had everyone at the conference in stitches laughing, although, being virtual I'm just assuming every one was laughing as hard as I was.
The final talk of Day 1 was given by Estelle Weyl. She capped off the day with a great talk on CSS3 animations. It was very cool once again to see the power of what CSS can do for a web application. She was able to demo some fairly complicated animations that require only a few lines of CSS and once again the viewers of the conference were blown away by the things you can accomplish in CSS.
The second day of Modern Web Conf was all about tools that developers use to make our lives easier. There were another great 7 talks on day 2 that showed the audience how to be more efficient when working with client side code.
Starting off the day was a lengthy talk on one of the most important tools of working on a team these days, git. Jordan Kasper gave a very thorough run through of all that you can accomplish with the most popular DVCS. He demo'd getting started with git all the way to connecting to github, working with git bisect, rebasing, and several other of git's built in tools. Everyone had a great time learning about git and even one viewer said that git was much less of a mystery to him now after having heard the talk.
I actually spoke during the second slot on day 2 about the importance of Unit Testing your client side code. My talk covered the basics of why you need to unit test your code for things like bugs, design, and maintainability. I also talked about some of the different testing strategies that exist out there like TDD and BDD. TDD on the client side was definitely the biggest focus of my talk and I talked about red, green, refactor while working with the simple test framework qunit.js. A few other tools such as sinon.js, plato, and blanket.js were also talked about. These tools can help ensure that bug free (ish) code make their way into production and the time spent fixing bugs is lessend by focusing more on the code at the forefront of a project rather than after launch.
A lot of developers tend to spend the majority of their time in the Chrome developer tools, but Raymond Camden of Adobe aimed to prove that there are many great features of other browsers including IE11 that can also be a great help to developers. He showed off the developer tools fo Chrome, IE, Firefox, Safari, and Opera and proved how each one can handle an error or some edge cases slightly differently. The audience was very surprised to see just how different the debugging experience can be from browser to browser, and was also enjoying the pictures Raymond had in his presentation as well as his awesome tattoos.
One of the most tedious parts of working with web applications is downloading and installing all the third party JavaScript files necessary for a modern web application. Starting with Backbone.js as the example since it requires both jQuery and Underscore as dependencies. Bob Yexley, a Senior JavaScript Engineer at appendTo gave a great overview of using Bower to manage an applications dependencies. Rather than having to go to all the different third party sites, download everything, copy it into the right directories, etc etc, with Bower it's as easy as bower install backbone. It's much simpler to work with bower because it works similar to NPM where you have a bower.json file that keeps track of the various libs that have been installed. This means you can keep your JavaScript dependencies out of your DVCS repo, and simply run bower install when you need them. He also showed off how easy it is to add bower to your library and make it usable by anyone.
It's a good thing that there was a break after the bower talk because Ryan Niemeyer , another Senior JavaScript Engineer stepped up to the plate and rocked it with a talk on Browser Memory Leak Testing. The oo's and aww's were pouring from the audience as Ryan de-mystified one of the most challenging tools in the developer tools of any browser, memory analyzing. He showed off and explained how to work with these tools, and how to prevent simple mistakes that can lead to memory leaks in your JavaScript code. Many of the things were as simple as removing event handlers as soon as an element is out of the DOM, which is something that is extremely common, but the browser clearly will hold on to memory if you're not careful. He also showed off how NOT to use the delete keyword, but rather set variables to null to set them up for garbage collection. This talk was a 600 level one.
No front end application these days would be complete without some sort of automation. Wether it's a library, a web app, or whatever, it's important to have something like Grunt or Gulp running tasks on your code such as testing, minifying, deploying, etc. Elijah Manor, a former appendTo employee and current employee of Dave Ramsey in Franklin, TN showed off how easy it is to get started with grunt. He showed off some of the popular plugins that you can easily implement in your build and also noted that there's almost 3,000 plugins you can use with grunt! This talk helped a few in the audience go from hearing about grunt to wanting to go try it out for themselves.
The final talk of the day was a very technical intro to a new vm tool known as Vagrant. Tim Ambler went straight into demoing this very cool new virtual machine system. He explained how you simply install virtual box, and vagrant and can get started with a Vagrant setup file to tell vagrant to quickly and efficiently setup a virtual machine that latches on to your current system. There are many different images you can use from the Vagrant cloud or create your own Vagrant image to allow you to setup a server running Ngnix, ruby, and node in a matter of minutes. Vagrant looks like a great tool to manage a team of developers on different platforms because no matter what OS they are running, a VM will be created that the developers can easily connect to and run applications.
The first virtual Modern Web Conf was a great success and left me excited to go play with all of the new information I had ammassed over just 2 days! There were so many new tools and frameworks presented that I couldn't wait to try for my self. I hope that we are able to do another Modern Web Conf next year to continue on with showing off how powerful the Modern Web is compared to techniques we were using not that far off ago in the past. It's incredible do see how far we've come as web developers and designers and there's no telling where we'll be next.