Go to the egghead website, i.e. Building a React.js App
run
$.each($('h4 a'), function(index, video){
console.log(video.href);
});Go to the egghead website, i.e. Building a React.js App
run
$.each($('h4 a'), function(index, video){
console.log(video.href);
});#How to Construct Yourself UI in KeystoneJS
KeystoneJS provide Admin UI with one set of route controllers and view templates(list&item) for all of the models.But usually,you will need some custome views other than Admin UI to display models. Although the KeystoneJS documention don't tell us much about how to contruct custome view,we can learn this from the source code in skeleton project generated by yo keystone,or you can just check out the keystone demo project's source code.We will walk through the blog feature's implementation in this demo application to demonstrate how to construct custome UI in KeystoneJS application.
As KeystoneJS documention described in Routes & Views section,there is a routes/index.js file, where we bind application's URL patterns to the controllers that load and process data, and render the appropriate template.You can find following code in it:
app.get('/blog/:catego
To implement API authentication in KeystoneJS, you need the following:
For key based authentication
For session based authentication
A tree visualization built using d3 and inspired from mbostock's work. Some of the features supported are:
The MIT License (MIT)
Copyright (c) 2014 Shubham Goel
mathclub是最近做的一个个人项目,帮助考SAT的同学通过在线做题、回顾、问答提高成绩。用户功能有:计次/计时做题、成绩单、错题分布、错题回顾、提问、汇总以及注册登录。管理后台主要是题库管理、学员管理、成绩单管理、问题回复。怎么看都像学校里的课设,的确项目本身并不出奇,开发上选用的一些方案或许更有意思。
整个项目一个人从产品需求、原型设计、前后端开发到部署历时2周左右。可以从截图上感受一下:
技术选型上服务端是Node.js,应用框架选了老牌的Express(4.x变化挺大不少中间件都废了),数据服务用的是MongoLab(MongoDB的云服务平台),图片上传用的是又拍云,程序部署在Nodejitsu上。模板引擎没选主流的Jade或ejs,而是用Express React Views它实现了在服务端渲染React组件。前端框架是用React,这次有意想追求前后端全部组件化的组织。之前是用Webpack实现CommonJS模块打包,这次用Browserify配置更简单,它有丰富的transform很赞,其中的reactify转换React的JSX很完美。CSS用Sass+autoprefixer让人省心。将这一切串起来的自动构建工具是Gulp。我其实崇尚用最精简的工具组合开发,上述组合在我看来比较精简了。(帖纸留念)
, | |
| app = express(), | |
| cookieParser = require('cookie-parser'), | |
| session = require('express-session'), | |
| RedisStore = require('connect-redis')(session); | |
| app.use(express.static(__dirname + '/public')); | |
| app.use(function(req, res, next) { | |
| if (~req.url.indexOf('favicon')) | |
| return res.send(404); |
Browserify is a tool that allows us to write node-style modules that compile for use in the browser. Like node, we write our modules in separate files, exporting external methods and properties using the module.exports and exports variables
generator-browserify is a generator with a Browserify setup, offering choices between Gulp or Grunt and Foundation or Bootstrap.
generator-angular-with-browserify is a generator for bundling Angular.js with Browserify
| //Practically all this code comes from https://github.com/alangrafu/radar-chart-d3 | |
| //I only made some additions and aesthetic adjustments to make the chart look better | |
| //(of course, that is only my point of view) | |
| //Such as a better placement of the titles at each line end, | |
| //adding numbers that reflect what each circular level stands for | |
| //Not placing the last level and slight differences in color | |
| // | |
| //For a bit of extra information check the blog about it: | |
| //http://nbremer.blogspot.nl/2013/09/making-d3-radar-chart-look-bit-better.html |
| var crypto = require('crypto'); | |
| var key = 'MySecretKey12345'; | |
| var iv = '1234567890123456'; | |
| var cipher = crypto.createCipheriv('aes-128-cbc', key, iv); | |
| var decipher = crypto.createDecipheriv('aes-128-cbc', key, iv); | |
| var text = 'plain text'; | |
| var encrypted = cipher.update(text, 'utf8', 'binary'); | |
| encrypted += cipher.final('binary'); | |
| hexVal = new Buffer(encrypted, 'binary'); |
| (function(){ | |
| var log = console.log; | |
| console.log = function(str) { | |
| var css = 'background: linear-gradient(to right, red, yellow, lime, aqua, blue, fuchsia, red); color: white; font-weight: bold;'; | |
| var args = Array.prototype.slice.call(arguments); | |
| args[0] = '%c' + args[0]; | |
| args.splice(1,0,css); | |
| return log.apply(console, args); | |
| } |