Category Archives: RSS Feed

Centering Things with CSS Flexbox

By Chris on Code

Flexbox has been out for a while now in CSS. Looking at the Can I Use Flexbox page, we can see that it’s acceptable in all modern browsers and even a little in IE!

Centering things in CSS before flexbox was always a chore. None of the major methods ever worked 100% consistently. Flexbox makes centering items as simple as 3 lines!

To set an item to use flexbox, we just have to use the CSS display property:

div {
    display: flex;
}

While flexbox may seem easy to use with the above line, it can be very powerful if you understand all of its properties. Let’s see some common flexbox centering tasks and how we can achieve them.

Centering Horizontally with Fl

Source:: scotch.io

React at Starbucks

By John Papa

ag-grid-logo-2

Cher Scarlett talks with John and Ward about her experiences working on the Starbucks PWA, and moving from Vue to React. Cher discusses what might motivate companies to move towards developing mobile apps using Progressive Web Apps (PWA) and how you can characterize the users of a native or PWA mobile apps. Along the way we discuss her story of moving from Vue.js to React.js and the plethora of programming platforms and languages that Cher has expertise in.

Recording date: 2020-01-21

const podcast = { 
  episode: 74,
  title: 'React at Starbucks',
  topics: [ 
    'react', 
    'pwa', 
    'deploying javascript' 
  ],
  guest: 'Cher',
  hosts: [
    'Ward Bell'}, 
    'Dan Wahlin' }, 
    'Craig Shoemaker', 
  ]
};

Brought to you by

Resources

Timejumps

  • 01:17:17 Guest introduction
  • 04:38:11 Why go PWA?
  • 08:08:16 Can you characterize PWA user vs mobile app user?
  • 10:21:20 Moving from Vue to React
  • 18:09:00 How did you handle data?
  • 25:09:00 Sponsor: IdeaBlade
  • 26:08:12 Writing with hooks and functional components

Hosts and Guests

Source:: johnpapa

Getting Started with Prismic - A Great Headless CMS

By Chris on Code

Prismic is a Headless CMS that provides a clean user interface. By using Prismic, we can avoid having to build out our own dashboard and CMS for our sites.

The power of using a Headless CMS is that we can have a solution out-of-the-box in a matter of minutes. We can then focus on what makes our product special, like our UI/UX, content, and more.

Prismic pricing

Prismic is generous with their pricing for people starting out their new sites. I’m running this tutorial on the free tier. They are also generous with their API usage; it’s unlimited!

For alternatives to Prismic, you can look at hosted solutions like Contentful,

Source:: scotch.io

Top 10 Static Site Generators in 2020

By James Quick

With the growth of the JAMstack and its community, Static Site Generators are becoming more and more popular. In this article, let’s take a look at the top Static Site Generators of 2020!

Why Static Site Generators

First off, let’s quickly talk about the benefits of Static Site Generators.

Speed

Static Site Generators generate your site pages at build-time instead of real-time. This means that when a user requests a page from your site, there is no delay. No calls to a database. No generating of HTML. It simply responds with the file itself.

Because of this, the hosting of your files is incredibly easy. By hosting your website in a Content Delivery Network (CDN), your files can be replicated across the world for maximum speed.

Security

Before Static Site Generators, developers would use popular Content Management Systems (CMS). Because of their popularity, they were often targeted by hackers. With Static Site Generators, you do

Source:: scotch.io