ROADMAP: Snippet

[teesloane]

Read this to:

Understand the road map for the emojion bar snippet.

I expect you to know:

Our general roadmap
How we are architecting the snippet code

Overview:

The Emojion bar snippet is one component of three in this project. We need to create an embeddable javascript snippet that a user can embed into their own website. The snippet's job is to find a way to create an emoji bar wherever the User (who installed the snippet) wants it to go.

Wireframe

Here is a basic wireframe that we will be following:

Example site

We use a dummy example page to test the snippet on. It is at the root of the snippet folder as example.html.

Issue List

The following steps are a general guideline (estimation, on my behalf) of how we might accomplish what we need to do. Each step has it's own issue (look for the number at the end of the line 👑)

• Make our function pipeline async-ready Make the pipe async! #9
• Template HTTP requests for hooking counters up to a backend. Template out HTTP requests #10
• write unit tests for each function in the render pipeline. Write unit tests #13
• Architecture: Create a function pipeline for organizing the snippet Snippet Architecture #3
• Find a way to mount the emoji bar into the dom Mounting the Emojion Bar into the Dom #4
• Set up JEST for testing Setup JEST #12
• create a function that spits out a stylesheet that can style our emojion bar Create a stylesheet and append it to the DOM. #7
• Manage the state of the emoji count (how many times an emoji has been clicked) Manage the state of an emoji bar #5
• Adaptive styling Adaptive Styling #8
• Set up CIRCLECI for automatically running our jest tests. Setup circleCI #11