Combining DocPad with Faker

103 views
Skip to first unread message

divya manian

unread,
Apr 16, 2012, 1:16:37 AM4/16/12
to doc...@googlegroups.com
Hi

I am trying to use DocPad as an easy app prototyping system. To this end, I was trying to create a prototype of an email inbox and attempting to do so with Faker.js (https://github.com/marak/Faker.js/) for data. In attempting this, I have come across this issue.

What would be the best way to combine data generated via Faker into the documents? I created an app.js within the 'src' folder and within that - with Faker - created a sample inbox array like so:

[
{
from: 'Foo',
subject: 'Bar',
snippet: 'Lorem Ipsum'
},
//repeat 50 times
]

but I cannot fathom how to include this data with a partial. I initially thought I would simply compile this into a snippet of html and have *that* included into areas I need them. But this would not take full advantage of eco templating engine (or HAML) to render said data.

I then thought I could simply output this as a JSON file and have it passed into the partial as an object. But I failed to see any documentation on how a partial can refer to a file for data. 

I would appreciate any pointers to how I could do this! Thanks! 

Benjamin Lupton

unread,
Apr 16, 2012, 7:45:02 AM4/16/12
to doc...@googlegroups.com
Hey Divya :)

There are a few ways you accomplish what you're after, and the best way will be totally up to you. But I'll let you know what pieces are available to you.

To create partials, you'll need the Partials Plugin which can be installed by doing a `npm install docpad-plugin-partials`. More info on installing plugins and the available plugins can be found on the Plugins Wiki Page.

Now that the partials plugin is installed, let's create a partial and use eco (as you've mentioned) for it. So we would make a file at `src/paritals/faker.html.eco`.

This is where we can start mixing things up. Though let's start with he simplest way first.

Inside your partial, let's add the following:

This is some fake data: <%=@require('faker').Name.findName()%>

What this does is require the faker dependency, and following the instructions on the Faker Readme generate a random name from scratch. We use eco to output the escaped content to our page. And as our partial has the `.html.eco` extension, will be rendered from eco to html.

The next step is to include our partial within our actual page, so let's do some sample code that will include the partial multiple times. So let's create the file `src/documents/example.html.eco` and stick in:

<ul>
 
<% for i in [0..10]: %>
   
<li><%-@partial('faker.html.eco')%></li>
 
<% end %>
</ul>

And that should do it.


Another way that you could do it, is inside your `server.coffee` file (using the balupton.docpad server.coffee as an example) we could add `templateData: {}` to our `docpadConfig`, and stick a whole bunch of fake data inside it (perhaps at `templateData: {fakePeople: [], fakeMessages: []}` then access them with something like:

<% for fakePerson in @fakePeople: %>
 
<%- @partial('person.html.eco', {person:fakePerson}) %>
<% end %>

Hope that helps Divya! Let me know if you need any further assistance :)

Also, while I'll try my best to make sure the DocPad Wiki is always useful, feel free to amend it with whatever improvements you feel would help others.

Thanks.
- Ben

divya manian

unread,
Apr 16, 2012, 11:37:28 AM4/16/12
to doc...@googlegroups.com
WOo thanks so much! Appreciate the help!

> --
> You received this message because you are subscribed to the Google Groups
> "DocPad" group.
> To view this discussion on the web visit
> https://groups.google.com/d/msg/docpad/-/wAFZG2M0YpEJ.
>
> To post to this group, send email to doc...@googlegroups.com.
> To unsubscribe from this group, send email to
> docpad+un...@googlegroups.com.
> For more options, visit this group at
> http://groups.google.com/group/docpad?hl=en.

divya manian

unread,
Apr 16, 2012, 11:49:36 AM4/16/12
to doc...@googlegroups.com
I am trying the simple way as I think this would be most useful for me.

On Mon, Apr 16, 2012 at 4:45 AM, Benjamin Lupton <balu...@gmail.com> wrote:

> This is some fake data: <%=@require('faker').Name.findName()%>

I am getting this error:

Something went wrong while rendering: src/partials/person.html.eco
error: An error occured: Object #<Object> has no method 'require'
TypeError: Object #<Object> has no method 'require'

I am a n00b at eco, so clearly this is some syntax error on my part?

Benjamin Lupton

unread,
Apr 16, 2012, 9:38:23 PM4/16/12
to doc...@googlegroups.com
Hrmmm, odd. Can you provide me with the project link (repo access) so I can take a look at the source?

Thanks :)


On Tuesday, 17 April 2012 01:49:36 UTC+10, divya manian wrote:
I am trying the simple way as I think this would be most useful for me.

divya manian

unread,
Apr 18, 2012, 7:18:09 PM4/18/12
to doc...@googlegroups.com
Hi Benjamin

On Mon, Apr 16, 2012 at 6:38 PM, Benjamin Lupton <balu...@gmail.com> wrote:
> Hrmmm, odd. Can you provide me with the project link (repo access) so I can
> take a look at the source?

Here it is: https://github.com/nimbupani/prototype/blob/master/src/documents/index.html.md.eco

This does not work for me, but doing this:
https://github.com/nimbupani/prototype/blob/master/src/partials/person.html.eco
works :///

Benjamin Lupton

unread,
Apr 18, 2012, 9:24:43 PM4/18/12
to doc...@googlegroups.com
Not able to test it, but 

<td><%= require('Faker').Name.findName() %> </td>

should be

<td><%= @require('Faker').Name.findName() %> </td>

The @require meanas this.require, as we are in eco, we use the this scope for our templateData. E.g. @document = this.document. Same goes.

Let me know if that works :)



On Thursday, 19 April 2012 09:18:09 UTC+10, divya manian wrote:
Hi Benjamin

Benjamin Lupton

unread,
May 9, 2012, 7:45:24 PM5/9/12
to doc...@googlegroups.com
Was able to test my code above with your prototype Divya. Turns out require has some funny issues with it. I'll address this in the next release of DocPad and will post back when it is done :)

Benjamin Lupton

unread,
Jun 22, 2012, 1:18:25 AM6/22/12
to doc...@googlegroups.com
DocPad v6 added the stuff we need, so I got it all working and submitted an issue on your repo: https://github.com/nimbupani/prototype/issues/1

All done :)
Reply all
Reply to author
Forward
0 new messages