• Stars
    star
    675
  • Rank 66,879 (Top 2 %)
  • Language
    JavaScript
  • License
    Other
  • Created almost 11 years ago
  • Updated almost 2 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

manage and organise things

Build Status tyto alt tag

tyto is an extensible and customizable management and organisation tool

just visit jh3y.github.io/tyto!

alt tag

Features

  • minimal UI
  • no accounts necessary
  • intuitive
  • extensible
  • localStorage persistence
  • time tracking
  • sortable UI
  • task linking
  • Markdown support
  • etc.

alt tag

Why tyto? What's it for?

Tyto arose from the want for an electronic post-it board without the need for accounts. Something simple and intuitive that could be easily shared.

It's also the product of my own curiosity being used as an opportunity to pick up new tech stacks. It started as a vanilla JS app utilising one file and experimenting with HTML5 drag and drop. It then grew a little more, and a little more after that. Now it uses Backbone w/ Marionette. The next step? Most likely Angular 2.0 or React.

alt tag

In truth, most organisations have some form of tool for what Tyto is doing. In my experience though, they can be cumbersome, clunky and just a bit noisy. Some employees tend to dislike internal tools. You still see whiteboards and walls plastered in sticky notes.

This is where Tyto came from, It's my personal intuitive and minimal TodoMVC. No accounts necessary and the source isn't too hard to grasp making it rather easy to extend and customise.

alt tag

Who's it for?

Developer and project managers were the original target audience. A means to share project progression on a more personal level. As opposed to publicly through an internal system. Almost like a complimentary attachment to an email.

alt tag

There are no restrictions though, it's open source. Not quite right out of the box? Change it πŸ˜„

Extensibility provides a means to create a bespoke version based on theme or functionality.

Tyto is a personal pet of mine and if it can help others, that's great!

###Using tyto Just want to use it? Do that by visiting jh3y.github.io/tyto.

GitHub flavored markdown is supported thanks to marked.

alt tag

This also enables you to link to boards, columns and other tasks by using the # character

alt tag

Changes are persistent thanks to localStorage.

Want to move to a different browser or machine though? Use the export utility to export a json file. Load this using the import utility.

A persistent workflow across devices? I'm afraid I haven't implemented that. Accounts is not something I am keen on implementing/hosting right now. I think it diverts from my original intention with Tyto.

Your own environment

Prerequisites

If you're cloning the repo and setting up the codebase you are going to need node(preferably yarn) and gulp installed.

Set up
  1. Clone the repo.

     git clone https://github.com/jh3y/tyto.git
    
  2. Navigate into the repo and install the dependencies.

     cd tyto
     yarn (alternatively, npm install)
    
  3. Run gulp to take care of preprocessing and running a local static server instance(project utilises BrowserSync).

     gulp
    

Hosting

I would suggest just taking a snapshot of the gh-pages branch and ftp'ing this onto your desired server or web space. Alternatively, follow the set up procedure and FTP the contents of the public directory.

If you wish to host on Github. Follow the set up procedure first(ideally, with a fork). When happy with your version, use the deploy task. This will require familiarity with gulp-gh-pages in order to publish to the correct location if other than gh-pages.

alt tag

Development

A strength of tyto is extensibility. Making changes whether it be functional or aesthetic is straightforward once familiar with the codebase.

Any queries as to how things work in the codebase? Feel free to raise an issue with a question!

alt tag

####Under the hood There are a range of technologies being used under the hood.

  • jQuery
  • jQuery UI
  • Material Design Lite
  • Lodash
  • Backbone
  • Marionette
  • Marked
  • Jade
  • Stylus
  • Babel
  • Gulp

alt tag

License

MIT


Made with ✨ @jh3y 2017

More Repositories

1

whirl

CSS loading animations with minimal effort!
SCSS
1,756
star
2

ep

enhance your HTML5 progress bars with minimal effort!
JavaScript
647
star
3

driveway

pure CSS masonry layouts
HTML
632
star
4

vincent-van-git

Use your Github commit history as a canvas!
JavaScript
288
star
5

meanderer

A JavaScript micro-library for responsive CSS motion paths! ✨
JavaScript
223
star
6

sketchbook

The home for all my demo source wherever you may find them! ⚑️
HTML
183
star
7

gulp-boilerplate

a simple gulp boilerplate
JavaScript
146
star
8

kody

.files and environment configuration manager created with node
JavaScript
139
star
9

doormat

Let's take a scroll!
JavaScript
110
star
10

jh3y

73
star
11

pxl

A React app for drawing pixel art
JavaScript
72
star
12

osaka-card

TypeScript
59
star
13

tips

CSS tooltips!
CSS
47
star
14

jhey.dev

Site source for jhey.dev ✨
JavaScript
47
star
15

a-guide-to-css-animation

Demo code for "A Guide to CSS Animation"
CSS
44
star
16

use-caret-position

A custom React hook for grabbing the caret position in a text input.
JavaScript
37
star
17

parcel-boilerplate

a boilerplate for using Parcel JS 😎
HTML
30
star
18

culr

color search engine
JavaScript
27
star
19

node-cli-boilerplate

a simple boilerplate to get up and running with node cli apps
JavaScript
27
star
20

creatives-directory

A list of creatives to follow on Twitter 🐦
JavaScript
23
star
21

view-transition-sandbox

Sandbox to get creative with the View Transition API
Astro
20
star
22

my-script-kit

JavaScript
20
star
23

move-things-with-css

The accompanying source for "Move Things With CSS"
CSS
20
star
24

focussed-twitter

Let's focus on the tweets! 🐦
JavaScript
17
star
25

subscription-calendar-view-transitions

MPA View Transitions Subscription Calendar
Astro
17
star
26

stationery-cabinet

The repository for the majority of my CodePen creations!
Pug
15
star
27

crayon

a repo for styling CodePen profiles
HTML
14
star
28

deck

Astro
14
star
29

pen-case

A local development boilerplate set up for creating new pens πŸ“
Makefile
12
star
30

sike

a cli app that reminds you to move around every once in a while!
JavaScript
11
star
31

russ

a node scripts runner 🐰
JavaScript
11
star
32

parcel-react-boilerplate

a boilerplate for bundling react applications with Parcel JS
JavaScript
10
star
33

netlify-cms-next-starter

Get up and running with Netlify CMS && Next.js
JavaScript
10
star
34

next-portfolio-starter

A portfolio starting point using Next.js, Netlify CMS, Storybook, and Tailwind
JavaScript
9
star
35

kody_env

My personal settings for kody .files manager
Shell
9
star
36

serverless-og

JavaScript
9
star
37

whac-a-mole-react

JavaScript
9
star
38

dynamic-island

An Astro playground for building a "Dynamic Island" for your site
CSS
9
star
39

round-table

CSS
8
star
40

egghead

a home for my egghead material source πŸ₯š
HTML
7
star
41

campfire

CSS
6
star
42

shooting-stars

HTML5 Canvas play around to create shooting stars effect
JavaScript
6
star
43

houdini-tesla

A CSS Houdini PaintWorklet for Tesla Coils
JavaScript
5
star
44

create-bangle-app

create and develop bangle.js apps from the command line
JavaScript
5
star
45

houdini-noise

CSS Houdini PaintWorklet for background noise
JavaScript
4
star
46

color-image-search-api

JavaScript
4
star
47

astro-mpa-bars

Quick POC for Astro Page Stinger View Transitions
TypeScript
4
star
48

which-key

an app for grabbing JavaScript KeyboardEvent info!
JavaScript
4
star
49

blurbs

Write something about me!
3
star
50

testPlayground

a repo for examples on how to set up mocha
JavaScript
3
star
51

jheymote

Audience remote for Jhey's conference talks
JavaScript
3
star
52

storybook-addon-studybook

Spin your Storybook into a learning aid with trackable progress.
JavaScript
3
star
53

key-book

create frozen enum objects from a string array ❄️
JavaScript
3
star
54

electron-parcel-react-starter

A starter project using Electron, React, and Parcel
JavaScript
3
star
55

border-radius-playground

An interactive visualisation tool for becoming a wizard with border-radius ✨
JavaScript
3
star
56

feedy

an angular app for consuming public photo feeds
JavaScript
3
star
57

inspector-gamut

A POC app for using AI to generate color palettes based on keywords
TypeScript
3
star
58

ng-mega-table

A directive for handling mega data
JavaScript
2
star
59

green-blocks

A Github Activity Visualizer Built with Next.js, React-Three-Fiber, Netlify, Tailwind, and GSAP
JavaScript
2
star
60

react-waves

A React component for making those fancy animated waves!
JavaScript
2
star
61

corvid

interactive command line Github API browser and cloning aid
JavaScript
2
star
62

blokky-road

3D CSS studio built with React on Vite
JavaScript
2
star
63

blink

JavaScript
2
star
64

fusion-hn

Hacker News example app built w/ Fusion JS
JavaScript
2
star
65

html5-boilerplate-jade-less-livereload.docpad

A skeleton for docpad using html5 boilerplate, less and jade.
CoffeeScript
1
star
66

interactive-twitch-overlay

Interactive Twitch Overlays Built with Tailwind && Next.js
JavaScript
1
star
67

sticky

A configurable sticky note component.
JavaScript
1
star
68

nodivember

CSS
1
star
69

blok-party

JavaScript
1
star
70

og-generator

A CLI tool for generating jh3y cover assets.
JavaScript
1
star
71

clinic

Submit your questions and issues for the clinic!
1
star
72

jheytompkins.com

source for
JavaScript
1
star
73

pencil-sharpener

Repo for storing my CodePen profile styling
HTML
1
star
74

next-storyblok-playground

JavaScript
1
star
75

gulp-template-store

a gulp plugin for storing lodash templates in a namespace object
JavaScript
1
star