Tagged: intermediate

Shadow DOM in Ionic

Shadow DOM Usage in Ionic Web Components

Beginning with Ionic 4, all of Ionic’s components will be web components. Unlike previous iterations of the framework where the components were built using Angular, the move to web components means Ionic can now be used just about anywhere. One aspect of web components is the ability to define custom HTML elements, which basically means […]

Ionic Logo White

Ionic Framework Is Fast (But Your Code Might Not Be)

I don’t want this article to come across as a self-righteous rant, or that I’m attacking people who have made statements like the ones I will use as examples in this article. The last thing I want to do is sound elitist or fan the flames of framework wars. So, I will precede this article […]

Stencil to Web Component to NPM

Publishing a Web Component Using Stencil (And Using It Anywhere)

Over the past couple of weeks we have explored creating custom components within Ionic/Angular, and creating custom web components using Stencil. Although both behave very similarly, the key difference between creating an Angular component, and a Stencil component, is that Stencil generates generic web components that can be used anywhere. Angular components can only be […]

Google Maps with Stencil

Creating a Google Maps Web Component with Stencil

Last week, we created a custom Google Maps component for an Ionic/Angular application. Since I have also been creating a lot of Stencil content recently, I think it is fun to see how we could build the same components that we build for Ionic/Angular, except as a generic web component with Stencil. To that end, […]

Time Bar

Improving the UI/UX of an Ionic Component

In this tutorial, we are going to improve upon the flash message service that we created in the last tutorial. I offered some suggestions for improving the service at the end of that tutorial which included: Allowing for different messages styles (success, danger, warning, etc.) Displaying a bar to indicate how long the message will […]

CouchDB Replication

Replicating a Cloudant Database to CouchDB

Last week, I wrote a tutorial that walked through how to set up a CouchDB database on a self-hosted Ubuntu server. I talked about some of the benefits of going for a self-hosted approach over using a service like Cloudant. One of the big benefits of the CouchDB protocol is how portable it is. With […]

TypeScript vs ES6

Adding ES6/TypeScript Support to a NodeJS Server

In past tutorials, we have covered setting up a basic Node/Express server and even integrating a Node server with Ionic. Up until this point, we have just been using the standard ES5 JavaScript syntax when building the server. If you are used to using Ionic, and many readers of this blog would be, then you […]