Hey Reader, I started migrating an app to nextjs (coming from an Ionic with Angular background) because I wanted to learn more about the react ecosystem. Last night I went through the routing documentation on their site and created the placeholder files and folders for all the pages my app will need, and doing so, I learned a few things about the App Router that I wanted to share with you. Check out what I've learned about the NEXT.js app router. So far, I like the simplicity of it all,...
5 months agoĀ ā¢Ā 1 min read
Hey Reader, After a little over a decade of working with Angular (ever since the days of Angular 1, now AngularJS) I decided giving react a serious chance, mostly due to what Iāve seen in my current job search, most of the job posts I see for front end developer have some sort of requirement for react. Yeah, even the āAngular Developerā roles have the line that says ā3-4 years with react.js is preferredā š
Here is a collection of things Iāve learned about react APIs and how they compare to...
5 months agoĀ ā¢Ā 1 min read
Hey Reader, This is a comprehensive tutorial that walks you through building your a mobile app using Ionic Framework, Angular, and Firebase. Whether you're new to these technologies or looking to refine your skills, this guide will take you through all the steps of setting up a full-stack mobile app, from installing dependencies to handling user authentication with Firebase Hereās what youāll learn: Setting up Ionic and Firebase in your project. Creating a mobile app that interacts with...
5 months agoĀ ā¢Ā 1 min read
Hey Reader, Changing the default styles of Ionic components can be a bit tricky since the components all use the shadow DOM, meaning we can't write CSS that targets the components inside the shadow DOM directly. Ionic has custom CSS variables in each component that allows us a lot of customization, and when those aren't enough, they expose CSS parts of the underlying HTML elements that form Ionic components. You can learn how to use shadow parts in this 3 minute video:...
about 1 year agoĀ ā¢Ā 1 min read
Hey Reader, One cool thing about Ionic, specially when you're using capacitor, is that a lot of the functionality that you use in your mobile app can also be used for the web. Most of capacitor plugins have a web implementation, which means, you wouldn't have to write extra code to get it to work. Learn how to transform your Ionic app into a PWA. In today's article, you'll learn: How to use the `ng add` schematic to get all the boilerplate done for you. How to edit the `manifest` file to set...
about 2 years agoĀ ā¢Ā 1 min read
Hey Reader, One cool thing about Ionic, specially when you're using capacitor, is that a lot of the functionality that you use in your mobile app can also be used for the web. Most of capacitor plugins have a web implementation, which means, you wouldn't have to write extra code to get it to work. Learn how to transform your Ionic app into a PWA. In today's article, you'll learn: How to use the `ng add` schematic to get all the boilerplate done for you. How to edit the `manifest` file to set...
about 2 years agoĀ ā¢Ā 1 min read
Hey Reader, I'm working on a video course for the EggHead platform and I wanted to share a quick bit with you. In this video, you'll learn how to set up your Firebase project in Ionic or Angular applications using AngularFire and the `ng add` schematic. After that, we'll explore the Firebase console to see the available services we have, talk a bit about the Firestore database and explain the 2 main types of data: Collections and Documents. After that, we'll use AngularFire to reactively pull...
about 2 years agoĀ ā¢Ā 1 min read
Hey Reader, When you use the slot="end" in a button icon, the icon is placed to the right side of the button text, It renders the button and the icon close to each other. Regular ion-button with text and icon I recently had a requirement to space them out so that the text was to the far left and the icon to the far right, as shown in the image below ion-button with the text aligned to the left and the icon to the right After spending an embarrasing amount of time trying to access the shadow...
about 2 years agoĀ ā¢Ā 1 min read
Hey Reader, When you use the slot="end" in a button icon, the icon is placed to the right side of the button text, It renders the button and the icon close to each other. Regular ion-button with text and icon I recently had a requirement to space them out so that the text was to the far left and the icon to the far right, as shown in the image below ion-button with the text aligned to the left and the icon to the right After spending an embarrasing amount of time trying to access the shadow...
about 2 years agoĀ ā¢Ā 1 min read