{"id":16186227,"url":"https://github.com/zenflow/ractive-isomorphic","last_synced_at":"2025-03-19T03:30:28.497Z","repository":{"id":31033826,"uuid":"34592419","full_name":"zenflow/ractive-isomorphic","owner":"zenflow","description":"Isomorphic abstract classes, Site and Page, derived from Ractive","archived":false,"fork":false,"pushed_at":"2015-06-21T20:01:21.000Z","size":570,"stargazers_count":8,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-02-28T14:44:13.021Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/zenflow.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-04-26T00:56:16.000Z","updated_at":"2016-03-17T08:35:49.000Z","dependencies_parsed_at":"2022-08-24T12:10:32.046Z","dependency_job_id":null,"html_url":"https://github.com/zenflow/ractive-isomorphic","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zenflow%2Fractive-isomorphic","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zenflow%2Fractive-isomorphic/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zenflow%2Fractive-isomorphic/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zenflow%2Fractive-isomorphic/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/zenflow","download_url":"https://codeload.github.com/zenflow/ractive-isomorphic/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243961575,"owners_count":20375271,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-10T07:17:37.428Z","updated_at":"2025-03-19T03:30:28.192Z","avatar_url":"https://github.com/zenflow.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# ractive-isomorphic (ri)\r\nIsomorphic abstract classes, `Site` and `Page`, derived from `Ractive`\r\n\r\n[![dependencies](https://david-dm.org/zenflow/ractive-isomorphic.svg)](https://david-dm.org/zenflow/ractive-isomorphic)\r\n[![dev-dependencies](https://david-dm.org/zenflow/ractive-isomorphic/dev-status.svg)](https://david-dm.org/zenflow/ractive-isomorphic#info=devDependencies)\r\n[![gitter](https://img.shields.io/badge/gitter-join%20chat%20%E2%86%92-brightgreen.svg)](https://gitter.im/zenflow/ractive-isomorphic)\r\n\r\n## Why?\r\n\r\nI wanted a full-stack reusable codebase for web-apps that are \r\n\r\n1. isomorphic\r\n2. fast, easy and fun to build and work on\r\n\r\n[Read the full explanation](https://github.com/zenflow/ractive-isomorphic/blob/master/WHY.md)\r\n\r\n## What is it?\r\n\r\nri is a couple of [isomorphic](http://nerds.airbnb.com/isomorphic-javascript-future-web-apps),\r\n[abstract](https://en.wikipedia.org/wiki/Class_\\(computer_programming\\)#Abstract_and_concrete) \r\nclasses, `Site` and `Page`, which can be extended to quickly and easily create awesome web-apps.\r\n\r\nThe common ancestor of both classes is [Ractive](https://github.com/ractivejs/ractive), the simplest, most powerful, \r\nmost pleasurable-to-work-with UI library for the web that I have ever loved. \u003c3\r\n\r\n## Example\r\n\r\nFor now, you can check out the [sandbox app](https://github.com/zenflow/ractive-isomorphic/tree/master/sandbox).\r\n\r\nSee the [Developing ri](#developing-ri) section for instructions on how to get it running.\r\n\r\n(Various advanced examples will be added to an examples folder, soonish.)\r\n\r\n## Installing\r\n\r\n#### 1. `npm install --save https://github.com/zenflow/ractive-isomorphic/tarball/master`\r\n\r\n#### 2. Extend `ri.Site` into `MySite`: the isomorphic blue-prints for your app\r\n\r\nA minimal example might look like this:\r\n\r\n```js\r\nvar ri = require('ractive-isomorphic');\r\nvar fs = require('fs');\r\nvar path = require('path');\r\nvar documentTemplate = process.browser ? null : fs.readFileSync(path.join(__dirname, 'document.html'), 'utf8');\r\nvar bodyTemplate = fs.readFileSync(path.join(__dirname, 'body.html'), 'utf8');\r\nvar pages = require('./pages');\r\n\r\nvar MySite = ri.Site.extend({\r\n\tdocumentTemplate: documentTemplate,\r\n\tbodyTemplate: bodyTemplate,\r\n\tpages: pages\r\n});\r\n\r\nmodule.exports = MySite;\r\n\r\n```\r\n\r\n#### 3. Use middleware returned by `MySite.connect(options)` with [connect](https://github.com/senchalabs/connect) or [express](https://github.com/strongloop/express) HTTP server frameworks\r\n\r\nAn entry-point for your server-side code may look something like this:\r\n\r\n```js\r\nvar connect = require('connect');\r\nvar http = require('http');\r\nvar path = require('path');\r\nvar MySite = require('../shared/MySite');\r\nvar api = require('../shared/api');\r\n\r\nvar app = connect();\r\napp.use(MySite.connect({api: api}));\r\napp.use(serveStatic(path.join(__dirname, '../client/build')));\r\nhttp.createServer(app).listen(3000);\r\n```\r\n\r\n#### 4. [browserify](https://github.com/substack/browserify) and serve the isomorphic and client-side-only portions of your codebase. \r\n\r\nri itself currently uses [gulp](https://github.com/gulpjs/gulp) (task-runner) for building the \"sandbox\" app, but \r\nany build system that supports or includes browserification will work just fine.\r\n\r\nAn entry-point for your client-side code may look something like this:\r\n\r\n```js\r\nvar MySite = require('../shared/MySite');\r\nvar api = require('../shared/api');\r\n\r\nwindow.site = new MySite({api: api});\r\n```\r\n\r\n## Getting help\r\n\r\n* ractive-isomorphic Documentation\r\n* [Ractive Documentation](http://docs.ractivejs.org/)\r\n* [zenflow/ractive-isomorphic on Gitter](https://gitter.im/zenflow/ractive-isomorphic)\r\n* [@zenflow87 on Twitter](http://twitter.com/zenflow87)\r\n\r\n## Developing ri\r\n\r\nFirst, fork [zenflow/ractive-isomorphic](https://github.com/zenflow/ractive-isomorphic) on github, then\r\n\r\n```\r\ngit clone https://github.com/your_username_here/ractive-isomorphic\r\ncd ractive-isomorphic\r\ngit checkout develop\r\nnpm install\r\nnpm start\r\n```\r\n\r\nThis will get the development server up and running, which for now only serves the \"sandbox\". \r\n\r\nThe sandbox is currently being used as both *the* example and *the* test. \r\n\r\n## Contributing\r\n\r\nPull requests and issues are always welcome! Please refer to [CONTRIBUTING.md](https://github.com/zenflow/ractive-isomorphic/blob/master/CONTRIBUTING.md)\r\n\r\n## License\r\n\r\nCopyright (c) 2015 Matthew Francis Brunetti and contributors. Released under an [MIT license](https://github.com/zenflow/ractive-isomorphic/blob/master/LICENSE).\r\n\r\n![ri logo](https://raw.githubusercontent.com/zenflow/ractive-isomorphic/master/logo.png)","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzenflow%2Fractive-isomorphic","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fzenflow%2Fractive-isomorphic","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzenflow%2Fractive-isomorphic/lists"}