Giter Club home page Giter Club logo

leaves.lite's Introduction

Appleseed Leaves.Lite - 0.4

This is a light-weight link/bookmark viewer for the Appleseed Search Platform ( part of the Appleseed Framework ).

Changelog

  • 0.1 - Kigg - ASP.net MVC 3 upgraded to 4 on IIS / SQL Server - Customized Theme. - 2011-2014
  • 0.2 - Single Page App in AngularJS using pure .JSON files. - 2015-2017
  • 0.3 - AngularJS 1.5 w/ Components in TypeScript using pure .JSON files. - 2016-2017
  • 0.4 - CURRENT - AngularJS 1.x in JS using Wallabag API - 2017-

Features

  • AngularJS 1.5 w/ Components (AngularJS 2 Coming)
  • Quickly share links / bookmarks (via Wallabag Plugin to Chrome / Wallabag App)

Where it began: KIGG

While at Anant, I was creating this to iterate on the original Kigg project which was written in ASP.net MVC 3. Kigg was a great "Digg" clone but we never had the time to get it up to speed. In hindsight, doing it as a SPA (Single Page Application) with different data providers (JSON, SolR, Elastic, Web.API) may be a good start.

Purpose of leaves.lite

The purpose of this leaves.lite project is to display links and make it easy to filter/search. The main use case is that we share a bunch of links at work. In essence, much of the knowledge we pass to each other is a series of links. A beginner may need to go through and read/ watch / try out examples. An intermediate level person may just need to get the "gist" of it. Most of the time we say "oh you should google that and go to the one by so and so."

Yes, we could have used Pocket, yes we could have used Pinterest, etc.. etc.. We initially thought about using the gitbook or gatsby approach and just rendering using static JSON files. This gets unmanageable with the amount of links we were managing which is now around ~4k and I still have another 10 to import.

We are currently using Wallabag API because Wallabag is open source and most of the components are dockerized. We are going to connect up our search-stack to this as a source and feedback in the search results from elasticsearch/solr as an option.

Quickstart :

Assuming you have node and npm installed, you can run the following commands to get started. I recommend using yarn if you have it. It's much faster that npm.

  • Download & Install Node https://nodejs.org/en/download/
  • git clone https://github.com/Appleseed/leaves.lite
  • cd leaves.lite/leaves.app
  • Edit leaves.lite/leaves.app/client/controller.js and add your URL and your API token.
  • npm install (or yarn install)
  • bower install (to be deprecated to use webpack)
  • node server/app.js
  • Open http://localhost:9000 in a browser to view the site

Follow the instructions to open it up on the browser. The file that feeds the links are in.

TODOS

There's a bunch of stuff left to do.

Interface:

  • TODO: add Component routing
  • DONE: migrate ideas from leaves.lite 0.2 (anant.co) layout
  • DONE: add bootstrap or other responsive layout management

Software:

  • TODO: implement universal rendering of result views/ individual / search views
  • TODO: implement different modes for leaf component (list, card, stack)
  • TODO: abstract JSON / REST behind a serviceFactory
  • TODO: think about using GRAPHQL as a standard and put Wallabag/Wordpress/Elastic, etc. behind it with apollo

Data / Database:

  • TODO: iterate on Leaf object definition (single item)
  • TODO: iterate on Leaves object definition (collection of items organized by tag)
  • TODO: iterate on twigPanel / "twig" object definition (shareable curated collection of items in a tree w/ ordering)
  • TODO: add examples to interact with elastic / solr / algolia type services
  • TODO: add examples to interact with web.api

Systems

  • DONE: create dockerfile
  • TODO: document how to run on azure
  • TODO: document how to run on github pages

leaves.lite's People

Contributors

jsbilgi avatar mddanishyusuf avatar niharikavattikonda avatar ramseur avatar xingh avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar

leaves.lite's Issues

leaves - docker - Docker Composition - v0.6 : + wordpress + mysql

Desc: Docker Composition - v0.6 : + wordpress + mysql

Acceptance Criteria: docker compose should be able to run components in dev, and prod mode.
dev

proxy

  • nginx or trafaek

leaves.lite
-- /read -> leaves:latest
-- /topic -> leaves:topic-latest
-- /app/wb -> wallabag web
-- /app/tt -> ttrss web
-- /app/wp -> wordpress web

  • appleseed/leaves:latest
  • appleseed/leaves:topic-latest

leaves.wb

  • wallabag/wallabag
  • mariadb
  • redis:alpine

leaves.tt

  • clue/ttrss
  • nornagon/postgres

leaves.wp

  • wordpess
  • mariadb

leaves - api - create wrapper for wallabag API / elastic API / solr API - iteration 1

​Desc: The wrapper should be able to provide the same interface for retrieving the leaves items.

Acceptance Criteria:

  1. Must conform to this schema example

[ { "area":"content-left", "name": "DOCKER: Self Paced Training", "path":"https://training.docker.com/self-paced-training", "ContentImages_small":"", "ContentImages_large":"", "title": "DOCKER: Self Paced Training", "content": "Docker's own self paced training class.", "category": "Training", "tags": ["docker","video"], "type": "Video", "source": "Docker" }, { "area":"content-left", "name": "Hackr.io : Learn Docker", "path":"https://hackr.io/tutorials/learn-docker", "ContentImages_small":"", "ContentImages_large":"", "title": "Hackr.io : Learn Docker", "content": "Listing of docker tutorials submitted and voted on by the programming community", "category": "Training", "tags": ["docker","tutorials"], "type": "Page", "source": "Docker" }
http://anant.co/data/topic.docker.js
2. Should be the same GET method in each implementation

leaves - docker - Docker Composition - v0.4 : + wallabag + redis + mysql

​Desc: Docker Composition - v0.4 : + wallabag + redis + mysql

Acceptance Criteria: docker compose should be able to run components in dev, and prod mode.
dev

proxy

  • nginx or trafaek

leaves.lite
-- /read -> leaves:latest
-- /topic -> leaves:topic-latest
-- /app/wb -> wallabag web

  • appleseed/leaves:latest
  • appleseed/leaves:topic-latest

leaves

  • wallabag/wallabag
  • mariadb
  • redis:alpine

leaves - ui - search - top search shows results from elastic (synced from wallabag)

​Desc: Results from the search bar show up like as if they were being pulled from wallabag API, but ranked by elastic ranking..

Acceptance Criteria: content is retrieved and shown identically to how its done now but the data is coming from an elastic search query. The search query is part of the URL so that the url can be passed around.

leaves.app - ui - reader - show first item in list if switching tags

​Desc: if the user the reader enabled by having clicked on an item, the reader should persist with different tag clicks

Acceptance Criteria: On home page load, show the default view. When a user clicks an item, show the reader. If the user clicks on another tag, the reader should refresh to show the first item in the tag.

leaves - ui - in the leaves reader have a way to read the original in an iframe

​Desc: Needs to be flushed out, but I was thinking that under the title, it has the user, a button for the original link ( these are in place now ), a link to the reader view, and a link to the iframe view.

Acceptance Criteria: User should be able to see the contents of the original link in an iframe that fits int the place of the reader content when clicked. If they click on reader, it goes back to default view. This could be a tabbed interface toggling between reader / original view.

leaves - docker - Docker Composition - v0.7 + search.engine + search.index + search.web.user

Desc: Docker Composition - v0.7 + search.engine + search.index + search.web.user

Acceptance Criteria: docker compose should be able to run components in dev, and prod mode.
dev

proxy

  • nginx or trafaek

leaves.lite
-- /read -> leaves:latest
-- /topic -> leaves:topic-latest
-- /app/wb -> wallabag web
-- /app/tt -> ttrss web
-- /app/wp -> wordpress web
-- /app/searh -> appleseed/search:web-user

  • appleseed/leaves:latest
  • appleseed/leaves:topic-latest

leaves.wb

  • wallabag/wallabag
  • mariadb
  • redis:alpine

leaves.tt

  • clue/ttrss
  • nornagon/postgres

leaves.wp

  • wordpess
  • mariadb

appleseed.search

  • appleseed/search:engine
  • appleseed/search:web-user
  • solr ?
  • elastic ?

leaves.app - devops - remove bower in preference for webpack

​Desc: Use webpack to download bower libs. all references are downloaded to the repo, these should be pulled from NPM / processed via webpack

Acceptance Criteria:
Remove bower as a dependency. Use webpack and build into npm install / init scripts.

  1. Installable and runnable via npm install and npm start
  2. or npm install , npm build , http-server dist (currently serves the index)

leaves - docker - move info into environment.yml

​Desc: Anything that is related to our own instance is moved into environment.yml and process.env.VARIABLE

Acceptance Criteria: move token, scope_base url, etc.. into environment.yml , create environment.dev.yml for testing.

leaves - ui - universal rendering of search

​Desc: When a search is executed, it does client side rendering.. if it is gone to using a url e.g. /search/blah it is rendered on the server side.

Acceptance Criteria: Search page loads fast without flicker, rendered server side if access directly.

leaves - ui - universal rendering of tag filtered content

​Desc: When a tag is clicked, it does client side rendering.. if it is gone to using a url e.g. /tagname/ it is rendered on the server side.

Acceptance Criteria: Tag filtered page loads fast without flicker, rendered server side if access directly.

leaves - topic.app - clean up / make a clean ui like anant.co

​Desc: Need to have a "landing" home page. ​This would look something like anant.co or anant.co/topic.html until someone clicks on a link, which then will go into the reader view. This will probably be a different docker container or maybe the same which does a simple read only and uses the existing anant.co template but populates from API not from the json.

Acceptance Criteria: User can go to a / and it shows a page like anant.co

image

or

the Docker prototype

image

leaves - ui - home / all - sort items by most recent first

​Desc: Right now it shows the oldest content first, need to show the latest content first.

Acceptance Criteria: When a link is added to wallabag using chrome or the wallabag admin, the most recent post shoudl show first on the home page, or if in a tag view, the latest one there.

leaves - docker - Docker Composition - v0.5 : + ttrss + postgres

Desc: Docker Composition - v0.5 : + ttrss + postgres

Acceptance Criteria: docker compose should be able to run components in dev, and prod mode.
dev

proxy

  • nginx or trafaek

leaves.lite
-- /read -> leaves:latest
-- /topic -> leaves:topic-latest
-- /app/wb -> wallabag web
-- /app/tt -> ttrss web

  • appleseed/leaves:latest
  • appleseed/leaves:topic-latest

leaves.wb

  • wallabag/wallabag
  • mariadb
  • redis:alpine

leaves.tt

  • clue/ttrss
  • nornagon/postgres

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.