git404hub

what is unlayer-itinerary-kit fr?

franksignorini/unlayer-itinerary-kit — explained in plain English

Analysis updated 2026-05-18

0HTMLAudience · developerComplexity · 3/5Setup · moderate

tl;dr

A travel itinerary template that renders the same booking design as an email, a web page, and a printable PDF from one set of components.

vibe map

mindmap
  root((unlayer-itinerary-kit))
    What it does
      One template three outputs
      Email web and PDF
      White label rebranding
    Tech stack
      React
      TypeScript
      Unlayer Elements
    Use cases
      Booking confirmation emails
      Live web itinerary page
      Printable travel document
    Audience
      Developers
      Travel product builders

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

what do people make with this?

VIBE 1

Generate a booking confirmation email, web page, and PDF from one set of trip data.

VIBE 2

Rebrand the entire itinerary template by editing just a brand file and a content file.

VIBE 3

Load the exported design JSON into Unlayer's visual editor for further edits.

what's the stack?

ReactTypeScriptUnlayer ElementsHTML

how it stacks up fr

franksignorini/unlayer-itinerary-kit100/rutgers-pbl-dining-2015a15n/a15n_old
Stars0
LanguageHTMLHTMLHTML
Last pushed2015-12-012016-06-18
MaintenanceDormantDormant
Setup difficultymoderateeasyeasy
Complexity3/51/51/5
Audiencedevelopergeneralgeneral

Figures from each repo's GitHub metadata at analysis time.

how do i run it?

Difficulty · moderate time til it works · 30min

Requires Node.js and familiarity with React to customize the brand and content files.

in plain english

Aurora Itinerary Kit is a template for a travel booking confirmation, built as an entry for a challenge run by Unlayer, a tool for designing emails and web pages. The idea is that a single set of React components can produce three different outputs from the same data: a confirmation email that works across email apps, a live web page version of the itinerary, and a print ready PDF version, all showing the same trip details laid out consistently. What makes this template stand out is that it separates the visual brand from the actual template code. Someone reusing this kit only needs to edit two files: one describing the brand, such as colors, fonts, and logos, and one describing the booking details, such as flight times and passenger names. The rest of the template does not need to change. To prove this works, the project ships with two different visual styles built from the exact same underlying components, showing that only the surface look changes while the layout logic stays the same. Running the build command produces ready to use files: the email as HTML, the web page as HTML, the printable document as both HTML and a real PDF, a plain text version of the email for email clients that need it, and a JSON file that can be loaded directly into Unlayer's visual design editor so a non-technical person could tweak it further. The template also includes three custom visual elements built specifically for this project: a scannable style barcode strip, a dashed flight path map with a plane icon, and a perforated ticket edge effect, each one designed to render correctly across email, web, and print formats. While building this, the author found and reported a bug in Unlayer's own rendering library, which has since been fixed for other users. This project is aimed at developers who build travel or booking related products and want a working example of sending the same visual design across email, web, and PDF from one codebase, rather than maintaining three separate templates by hand.

prompts (copy fr)

prompt 1
Help me set up this itinerary kit and swap in my own brand colors and fonts.
prompt 2
Explain how the itineraryRows function renders the same layout for email, web, and PDF.
prompt 3
Walk me through customizing the booking data in src/content/itinerary.ts for a new trip.
prompt 4
Show me how to load the exported design.json into the Unlayer visual editor.

Frequently asked questions

what is unlayer-itinerary-kit fr?

A travel itinerary template that renders the same booking design as an email, a web page, and a printable PDF from one set of components.

What language is unlayer-itinerary-kit written in?

Mainly HTML. The stack also includes React, TypeScript, Unlayer Elements.

How hard is unlayer-itinerary-kit to set up?

Setup difficulty is rated moderate, with roughly 30min to a first successful run.

Who is unlayer-itinerary-kit for?

Mainly developer.

peek the repo → explain another one

This repo across BitVibe Labs

double-check against the repo, no cap.