Brook

Adding a Card Component to Our Homepage (early)

In day 30 of our 30 Days of Brook video series we finish the homepage adding three product category cards component we made in a previous video.

Tim Murphy

04/30/2019 · 2 minute read

Video

Adding a Custom Font to Homepage Banner (early)

In day 29 of our 30 Days of Brook video series we finish our homepage banner adding a custom font family from our style guide.

Tim Murphy

04/29/2019 · 2 minute read

Video

Responsive Background Hero Image (early)

In day 28 of our 30 Days of Brook video series we create our responsive background hero image.

Tim Murphy

04/28/2019 · 2 minute read

Video

Finishing the Homepage in Brook (early)

In day 27 of our 30 Days of Brook video series we finish the custom nav bar for our fictional homepage including using our custom artisan command to sync it to our Laravel project.

Tim Murphy

04/27/2019 · 2 minute read

Video

Working on a Homepage in Brook (early)

In day 26 of our 30 Days of Brook videos we get started on our custom homepage working on the nav bar.

Tim Murphy

04/26/2019 · 2 minute read

Video

Customizing Text and Icons in the Image Studio (early)

In day 25 of our 30 Days of Brook video series we have a quick animation of some of the ways you can customize the text and icons in the image studio.

Tim Murphy

04/25/2019 · 1 minute read

Video

Custom Laravel Artisan Command in Brook (early)

In day 24 of our 30 Days of Brook video series we show a quick animation of our custom Laravel artisan command for syncing your Brook components to your Laravel projects.

Tim Murphy

04/24/2019 · 1 minute read

Video

Pair Programming Features in Brook (early)

In day 23 of our 30 Days of Brook video series we look the pair programming features in Brook.

Tim Murphy

04/23/2019 · 2 minute read

Video

Engagement Indicators in our Collaborative Chat Feature (early)

In day 22 of our 30 days of Brook video series we look at more of our collaborative features such as chat and what they are working on through various engagement indicators.

Tim Murphy

04/22/2019 · 2 minute read

Video

HTML Tree Feature (early)

In day 21 of our 30 Days of Brook video series we show a quick animation of our HTML tree feature.

Tim Murphy

04/21/2019 · 1 minute read

Video

Syncing the Editor and Visual Tools with the Realtime Viewer (early)

In day 20 of our 30 Days of Brook video series we show you the code editor syncing not only with the visual tools but also the realtime viewer.

Tim Murphy

04/20/2019 · 2 minute read

Video

Synchronized Code Editor and Visual Tools (early)

In day 19 of our 30 Days of Brook video series we look at how the code editor is automatically synchronized with the visual tools.

Tim Murphy

04/19/2019 · 2 minute read

Video

Tailwind Auto Selector, Improved (early)

In day 18 of our 30 Days of Brook video series we look again at our Tailwind auto selector feature which was updated to work simply by clicking on the class in the code editor.

Tim Murphy

04/18/2019 · 2 minute read

Video

Photo Filters and Effects in the Image Studio (early)

In day 17 of our 30 Days of Brook video series we walk through the photo filters and effects available in our image studio.

Tim Murphy

04/17/2019 · 2 minute read

Video

Automatic Class Selector (early)

In day 16 of our 30 Days of Brook video series we demonstrate our automatic class selector which directs you to the corresponding panel within the visual tools.

Tim Murphy

04/16/2019 · 2 minute read

Video

Tailwind Autocomplete Feature (early)

In day 15 of our 30 Days of Brook video series we introduce the Tailwind autocomplete feature.

Tim Murphy

04/15/2019 · 1 minute read

Video

Adding a Reduced Opacity Image Over a Background Color (early)

In day 14 of our 30 Days of Brook video series we look at adding a reduced opacity image over a background color for an interesting affect.

Tim Murphy

04/14/2019 · 2 minute read

Video

Using the Text Tool in the Image Studio (early)

In day 13 of our 30 Days of Brook video series we talk about the text tool in the image studio for use when you want text to be part of the image.

Tim Murphy

04/13/2019 · 2 minute read

Video

Keeping Track of Assets with our Attribution Feature (early)

In day 12 of our 30 Days of Brook video series we cover the attribution feature which helps you keep track of all the assets that you bring into the platform such as Unsplash images or Google fonts.

Tim Murphy

04/12/2019 · 2 minute read

Video

Brook's Realtime Viewer (early)

In day 11 of our 30 Days of Brook video series we look at the realtime viewer which shows the component in real time in its own browser.

Tim Murphy

04/11/2019 · 2 minute read

Video

Creating a Card with a Responsive Image (early)

In day 10 of our 30 Days of Brook video series we make a card with a responsive image in the component studio using several different image variants.

Tim Murphy

04/10/2019 · 2 minute read

Video

Real Time Collaborative Features in Brook (early)

In day 9 of the 30 Days of Brook video series we show you some of the collaborative features in Brook. Two users on different computers can see updates from the other user in real time.

Tim Murphy

04/09/2019 · 2 minute read

Video

Visual Sliders for Adjusting Width, Height, and Font Size (early)

In day 8 of the 30 Days of Brook video series we talk about the UI in the component studio including visual sliders for adjusting things like width, height, and font size.

Tim Murphy

04/08/2019 · 2 minute read

Video

Screen Sizes and Breakpoints (early)

In day 7 of our 30 Days of Brook video series we look at screen sizes and breakpoints including adding or editing breakpoints in the style guide and viewing them on the fly in the component studio.

Tim Murphy

04/07/2019 · 2 minute read

Video

Visually Add Margin and Padding Using Our Spacing Tool (early)

In day 6 of our 30 Days of Brook video series, we take a closer look at our spacing tool for visually adding margin and padding to your components.

Tim Murphy

04/06/2019 · 2 minute read

Video

Adding or Editing a Custom Font Family (early)

In day 5 of the 30 Days of Brook video series, we show you how to add or edit a custom font family to your style guide using google fonts.

Tim Murphy

04/05/2019 · 2 minute read

Video

Automatic Code Formatting and Tailwind Class Ordering (early)

In day 4 of our 30 Days of Brook video series, we show you our code clean-up feature that takes unformatted code and it reformats it automatically and also a class clean-up feature that orders your tailwind classes automatically.

Tim Murphy

04/04/2019 · 2 minute read

Video

Composing Components With Other Components (early)

In day 3 of our 30 Days of Brook Video series, we turn a button into a component and add it to a nav bar component using an @include.

Tim Murphy

04/03/2019 · 2 minute read

Video

Creating a Responsive Background Image (early)

In day 2 of our 30 Days of Brook video series, we show you how to make a responsive background image in the image studio by creating multiple variants of the image to work on various sized screens.

Tim Murphy

04/02/2019 · 2 minute read

Video

First Look at the Style Guide (early)

In day 1 of our 30 Days of Brook video series, we show you how to add a custom set of colors in the style guide and and commit it, compiling the tailwind into css and js files that you can use directly or in another build environment.

Tim Murphy

04/01/2019 · 2 minute read

Video

Our first Brook Demo (early)

In our first ever Brook demo, we go through the process of visually designing a responsive nav bar.

Tim Murphy

03/31/2019 · 17 minute read

Blog Posts & Videos

Adding a Card Component to Our Homepage (early)

Adding a Custom Font to Homepage Banner (early)

Responsive Background Hero Image (early)

Finishing the Homepage in Brook (early)

Working on a Homepage in Brook (early)

Customizing Text and Icons in the Image Studio (early)

Custom Laravel Artisan Command in Brook (early)

Pair Programming Features in Brook (early)

Engagement Indicators in our Collaborative Chat Feature (early)

HTML Tree Feature (early)

Syncing the Editor and Visual Tools with the Realtime Viewer (early)

Synchronized Code Editor and Visual Tools (early)

Tailwind Auto Selector, Improved (early)

Photo Filters and Effects in the Image Studio (early)

Automatic Class Selector (early)

Tailwind Autocomplete Feature (early)

Adding a Reduced Opacity Image Over a Background Color (early)

Using the Text Tool in the Image Studio (early)

Keeping Track of Assets with our Attribution Feature (early)

Brook's Realtime Viewer (early)

Creating a Card with a Responsive Image (early)

Real Time Collaborative Features in Brook (early)

Visual Sliders for Adjusting Width, Height, and Font Size (early)

Screen Sizes and Breakpoints (early)

Visually Add Margin and Padding Using Our Spacing Tool (early)

Adding or Editing a Custom Font Family (early)

Automatic Code Formatting and Tailwind Class Ordering (early)

Composing Components With Other Components (early)

Creating a Responsive Background Image (early)

First Look at the Style Guide (early)

Our first Brook Demo (early)

Company

Legal

Subscribe to our newsletter