This is a simple repo to outline to structure of your documented integrations.
Creating an integration is easy:
###Step 1: Proof of Concept in Static Website
Make a working example in the src/ directory. Users will clone this entire repo and look at the src code for an example.
Extract the integration assets, bundle them for distribution, and move them into your dist/ folder. Any configuration (api keys, etc) need to be extract from the minified bubundle.
After your demo is complete and your assets are bundled, take some time to create a meaningful readme. It will help users get up and running with your integration. Note: We will not accept integrations without a solid readme.
As we build our first 10 integrations, we want to follow a specific, repeatable guidelines. That being said, we also want to be descriptive in our git commits, code comments, and overall approach to solving problems. This will allow other bowtie users to extend you integrations and contribute online.
Your src/ directory is your demo directory. It's important that your realize most users will run this jekyll build before integrating your code.
- Write a README.md for this file
Your bundled assets need to follow a few specific guidelines.
-
All assets must be minified. These are blind assets anyone can copy into their site without needing to customize.
-
Follow this naming structure:
- integration_name.bundle.min.js && integration_name.bundle.min.css
Basic Implementation
{% for tweet in site.data.tweets %}
{{ twitter.option }}
{% endfor %}
Options:
Available Options:
tweet.text # text content of tweet
tweet.user # twitter handle of user who tweeted tweet
tweet.user.avatar # url to user profile photo
tweet.urls.url # link to the tweet
tweet.created_at # time/date of tweet
Another example
<ul class="tweet-list">
{% for tweet in site.data.tweets %}
<li>
<span class="post-meta">{{ tweet.created_at | date: "%b %-d, %Y" }}</span>
<h4>
<a class="tweet-link" href="{{ tweet.urls.url | prepend: site.baseurl }}">{{ tweet.text }}</a>
</h4>
</li>
{% endfor %}
</ul>
###Notes
- could/should enforce sass dir and encourage all assets to be contained into their own @import
- all js affiliated with a file should be in its own file.