Just came back from OReilly Fluent Conference, and it was fun. Learned a bunch of topics like web components, security, best practices, hypermedia API’s and organizing a team. I will talk about each one of these topics, based on my slides.
For creating reusable components for the web, there are only new standards being talked about. Despite the standards not being ratified by all the browsers, there are a couple of things you can do to make it useful in all browsers. First things first, let’s talk about the standards:
Sort of like script or link tags, you can link HTML using HTML Imports
If you have used Handlebars, then this will be similar to those libraries. The difference is you can also include javascript and css.
Think of Shadow DOM as way to separate your view from your logic. If you use custom elements, you can take elements that don’t render, and make them render with Shadow DOM.
This is how you can develop elements to encapsulate all the logic above into a custom element.
Now, to help make these evolving standards work in other browsers, you need a polyfill. The polyfill to do this is call Polymer. Polymer has 4 layers to help abstract away native browser to give the ability to create reusable objects.
For security, there are 3 places to concentrate on, client, server, and messages in between. Starting with the client, take a look at things like cross-site scripting attacks (XSS) and Cross-Site Request Forgery (CSRF). These are easy things you can look into, to help keep your client safe. For cookies and sessions, you can make them http only and use HTTPS. Headers are important, so make sure the headers do not give too much information. Look into Content-Security-Policies to help with securing header information.
In the server side, you should watch out for injection, of all kinds, not just SQL, but No Sql, and OS as well. Always make sure types match up, especially in dynamic typed languages. Try catches will makes sure your server does not crash, and watch out for Regular expressions for taking too long. This will avoid your server from being DDOS.
For storing secure sessions, try using tokens. These can be stashed in local storage safely, and avoid many CSRF attacks. For even more tips, visit OWASP to find tools and other attacks to look into for security.
Web development is hard, dynamic languages are messy and it takes time to develop a web app. Because of this, it is super important to set up several items:
Hypermedia clients are interesting. You are not creating reusable UI’s, but you are not making a reusable backend. The idea is that you are creating mid-ware that is reusable and resilient to change. To do this, you will need to create a media type that everyone has agreed on, like Hal, or Collection+JSON. In your client, many things will be determined at runtime, this is different from the build time process we might be use to in c#. In order to help drive the point home of hypermedia client, build a client application to show how it works. Lastly, if you are building a Hypermedia API, check out this book by Glenn Block. The name is Designing Evolvable Web APIs with ASP.NET. This is a great book to demostrate EVERYTHING you will need to create a hypermedia server.
In order to explore new frameworks and platforms, you need to have your team be able to study new things. But how do you research what is right? There are several groups of questions that you should take into account when looking at a new tool. Here are some categories:
Internal | External | |
---|---|---|
People | Familiarity | Popularity |
Project | Interface | Activity |
Using these 4 categories, you can create a list to evaluate the need for a unpacking technical decision.