Skip to content

Link to Next/Previous objects in a JSON file #189

@myk13

Description

@myk13

I'm looking for a way to link to the 'next' and 'previous' objects in a JSON file.

On IRC kennethormandy requested I log this as he has a recipe for it.

Activity

kennethormandy

kennethormandy commented on Jan 9, 2014

@kennethormandy
Collaborator

Here it is with comments, I will get around to making it a full recipe soon with a lot more detail, but hopefully this is enough to get you going.

//- Create an empty array of the articles
articles = []
//- Iterate over the articles like you would normally
for article, slug in public.articles._data
  //- Assign the slug, which is the object key, to a value instead
  - article.slug = slug
  //- Push each article into the empty array
  - articles.push(public.articles._data[slug])

//- Iterate over the articles array
each article, i in articles
  //- Article slug is the old object key that matched the file name,
  //- Like "a-post" for example
  //- Match it against the current page
  if article.slug == current.source
      //- Previous is one before this array item
      //- Next is one after
      //- Variables make it easy to template
      - prev = articles[i - 1]
      - next = articles[i + 1]
      //- The actual links
      ul
      if prev
        a(href="#{ prev.slug }") ← #{ prev.title }
      if next
        a(href="#{ next.slug }") #{ next.title } →

Here is the _data.json file I’m using, in articles/_data.json:

{
  "welcome-to-harp": {
    "title": "Welcome to Harp"
  },
  "go-out-and-make-it-your-own": {
    "title": "Go Out & Make It Your Own"
  },
  "a-post": {
    "title": "An example post"
  }
}
kennethormandy

kennethormandy commented on Jan 9, 2014

@kennethormandy
Collaborator

Added it to the next-post branch of my Harp boilerplate, hb-remedy if you want a working example. It will also handle draft posts and sorting by dates appropriately.

hb-remedy-next-prev

ajmalafif

ajmalafif commented on Jan 9, 2014

@ajmalafif

OMG what a week for me! This is the feature I've been loooong wanting for static generator. I asked Ghost forum every other month about this and the latest they gonna have it is v0.5 (now is v0.3.3), hexo, assemble.io and others..

I thought that porting from WordPress I'm only going to miss this one feature when using static gen, but now that @kennethormandy figured this out ⚡

silentrob

silentrob commented on Jan 9, 2014

@silentrob
Collaborator

@ajmalafif How did you first hear about Harp? We need to find more people as excited as you are to try it :)

ajmalafif

ajmalafif commented on Jan 9, 2014

@ajmalafif

@silentrob Ouch! 😆

I don't remember exactly which one was first, but it's either from these two sources;

  1. http://staticsitegenerators.net/ — you can safely say I tried almost all just to find the right fit. From ruby-based to JS. Was liking JS since I tried Hexo, Ghost, Wintersmith, and Docpad (in that order; some others afterward as well like roots.cx).

  2. I think there's this week Harp is being featured in Github's explore, JS Daily and web-tools weekly.

Beautiful things don't ask for attention. — Sean O'Connell, The Secret Life of Walter Mitty

I think if you've gone through almost everything on http://staticsitegenerators.net/ but can't really find a comparable to current setup/choice (WordPress), everyone would be as excited as I am! I mean generally of course static is always faster that's a given but to what extend can I compromise features-wise (like assets file management, SEO-wise as a blog/site, interactivity-wise for showcasing my work).

I would confidently and proudly say Harp is the best option out there for static generator, at very little need to compromise anything at all.

My next concern would be how to handle external/3rd-party javascript for some extra interactivity to be included in my Harp setup, but from what I can wrap my head around right now, that's already doable in Harp. I believe I just need to figure out or ask here (since you guys are very helpful and welcoming)!

myk13

myk13 commented on Jan 9, 2014

@myk13
Author

That's awesome! Thanks @kennethormandy. I was sooo close - can't believe I didn't get there. Very much appreciated.

@silentrob - Personally, I only stumbled across harp a few days ago. I'm pretty sure it was initially via http://webdevrefinery.com/forums/topic/13153-ghost-a-nodejs-blogging-framework/. I was playing with assemble.io and Wintersmith as an alternative to Middleman. I was just looking for something really simple, that I could drop into my existing Grunt workflow. My test was to build an average small site with 30 pages across 5 templates exactly the same with Harp, Assemble and Wintersmith. I had already built the site once with Middleman, so had worked out the structure, design concerns, etc. I simply built it with Harp faster - I just needed the 'next'/'previous' issue answered.

As far as static sites go, I'm sold. The only thing I could ask for at this point is more recipes and the ability to generate pages from JSON - both of which are already being discussed.

kennethormandy

kennethormandy commented on Mar 6, 2014

@kennethormandy
Collaborator

This has been pretty well covered now, so I’m going to close the issue.

If you want to read about it, check out:

mcbjam

mcbjam commented on Jan 30, 2015

@mcbjam

Hi.

You are looking for

articles.indexOf(current.source);

This is a link explain what you want to do with harp :
http://www.raymondcamden.com/2014/02/26/Creating-NextPrevious-Links-in-HarpJS

One of my Website with Harp : http://buzz.mcbjam.com/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Labels

Projects

No projects

Milestone

No milestone

Relationships

None yet

    Development

    No branches or pull requests

      Participants

      @silentrob@ajmalafif@myk13@kennethormandy@mcbjam

      Issue actions

        Link to Next/Previous objects in a JSON file · Issue #189 · sintaxi/harp