MEANJS Tutorial – bossable(30 DAY MEAN STACK CHALLENGE)

http://www.bossable.com/

http://meanjs.org/
https://www.heroku.com/
https://toolbelt.heroku.com/
http://mongoosejs.com/
http://getbootstrap.com/
http://expressjs.com/
https://angularjs.org/
https://docs.angularjs.org/api/ng/directive
https://angular-ui.github.io/
http://angular-ui.github.io/bootstrap/#/modal

4.
home.client.view.html
Boostrap
core.css
home.client.controller.js
$scope.alerts
home.client.view.html
ng-repeat https://docs.angularjs.org/api/ng/directive/ngRepeat

5.
\config\strategies\facebook.js
// Create the user OAuth profile
var providerUserProfile = {
firstName: profile.name.givenName,
lastName: profile.name.familyName,
displayName: profile.displayName,
email: profile.emails[0].value,
username: profile.username,
provider: ‘facebook’,
providerIdentifierField: ‘id’,
providerData: providerData
};

6. Sign In Page
\public\modules\users\views\authentication\signin.client.view.html
http://getbootstrap.com/components/#input-groups

7.
\public\modules\users\views\authentication\signin.client.view.html
\public\modules\users\css\users.css
\node_modules\passport-local\lib\strategy.js
Alerts http://getbootstrap.com/components/#alerts
\public\modules\users\controllers\authentication.client.controller.js

8.
\public\modules\users\views\authentication\signup.client.view.html

9.
\public\modules\users\
\public\modules\core\services\menus.client.service.js
\public\modules\customers
\public\modules\customers\config\customers.client.routes.js
http://localhost:3000/#!/customers

10.
\app\models\customer.server.model.js
\app\controllers\customers.server.controller.js
\app\routes\customers.server.routes.js
\public\modules\customers\services\customers.client.service.js
\public\modules\customers\controllers\customers.client.controller.js
// Create new Customer
$scope.create = function() {
// Create new Customer object
var customer = new Customers ({
firstName: this.firstName,
surname: this.surname;
suburb: this.suburb,
country: this.country,
industry: this.industry,
email: this.email,
phone: this.phone,
referred: this.referred,
channel: this.channel
});
\public\modules\customers\config\customers.client.routes.js
\public\modules\customers\views\view-customer.client.view.html
http://localhost:3000/#!/customers/create

11.

12.
\public\modules\customers\views\create-customer.client.view.html

13.
\public\modules\customers\css\customers.css

14.

15.
\public\modules\customers\views\list-customers.client.view.html
\public\modules\customers\services\customers.client.service.js
\app\routes\customers.server.routes.js
\app\controllers\customers.server.controller.js

16.

17.
\app\models\customer.server.model.js

18.
https://docs.angularjs.org/api/ng/filter/filter

19.
http://getbootstrap.com/javascript/#modals
\public\modules\customers\controllers\customers.client.controller.js

20.
\public\modules\customers\config\customers.client.routes.js
\public\modules\customers\views\edit-customer.client.view.html

21.

22.

24.
https://docs.angularjs.org/guide/directive

\public\modules\customers\views\view-customer.client.view.html
Rename to
\public\modules\customers\views\customer-list-template.html

25.

29.
\server.js
\config\express.js
\config\env\all.js
\bower.json
\config\env\production.js

30.
cmd $ grunt build
\public\dist\
package.json

30(i).
https://www.heroku.com/
https://toolbelt.heroku.com/

cmd $ heroku login
cmd $ cd PROJECT PATH
cmd $ heroku create
cmd $ git push heroku master
cmd $ heroku config:set NODE_ENV = production
cmd $ heroku open

WordPress 外掛

外掛

語言轉換
Polylang
http://wordpress.org/plugins/polylang/

選單
Menu Image
https://wordpress.org/plugins/menu-image/
Nav Menu Images
https://wordpress.org/plugins/nav-menu-images/

幻燈片
Meta Slider
https://wordpress.org/plugins/ml-slider/

文章顯示
Content Views
https://wordpress.org/plugins/content-views-query-and-display-post-page/
Simple Featured Posts Widget
https://wordpress.org/plugins/simple-featured-posts-widget/
AK Featured Post Widget
http://wordpress.org/plugins/akfeatured-post-widget/

Tabs
Tabby Responsive Tabs
https://wordpress.org/plugins/tabby-responsive-tabs/

Google 地圖
WP Google Map Plugin
https://wordpress.org/plugins/wp-google-map-plugin/

隨機顯示文字
Random Text
https://wordpress.org/plugins/randomtext/
隨機產出文字
http://randomtextgenerator.com/
http://www.randomtext.me/

隱藏頁面標題
Hide Page and Post Titles
https://wordpress.org/plugins/hide-page-post-titles/

表單
Contact Form 7
http://wordpress.org/plugins/contact-form-7/
Contact Form 7 reCAPTCHA Extension
http://wordpress.org/plugins/contact-form-7-recaptcha-extension/
WP-reCAPTCHA
http://wordpress.org/extend/plugins/wp-recaptcha/
Really Simple CAPTCHA
https://wordpress.org/plugins/really-simple-captcha/

備份/複製
BackWPup Free
https://wordpress.org/plugins/backwpup/
Duplicator
https://wordpress.org/plugins/duplicator/

購物車
WooCommerce
http://wordpress.org/plugins/woocommerce/
WP eCommerce
https://wordpress.org/plugins/wp-e-commerce/

社交媒體
Facebook for WordPress
https://wordpress.org/plugins/facebook/
Social Sharing Toolkit
https://wordpress.org/plugins/social-sharing-toolkit/
Creativ Shortcodes Plugin
http://pixelatedminds.com/creativ-shortcodes-a-wordpress-plugin
Social Media Shortcode Pack
https://wordpress.org/plugins/social-media-shortcodes/

版面設計
Page Builder by SiteOrigin
http://wordpress.org/plugins/siteorigin-panels/
Easy Bootstrap Shortcode
https://wordpress.org/plugins/easy-bootstrap-shortcodes/
Bootstrap Shortcodes for WordPress
https://wordpress.org/plugins/bootstrap-3-shortcodes/
Column Shortcodes
https://wordpress.org/plugins/column-shortcodes/
Grid Columns
https://wordpress.org/plugins/grid-columns/
How To Create Columns In Posts
http://vip.wordpress.com/documentation/how-to-create-columns-in-posts/

<div style=”width: 30%; padding: 0 10pt 0 0; float: left;”>
Column 1 info here
Column 1 info here
Column 1 info here
</div>
<div style=”width: 30%; padding: 0 10pt 0 0; float: left;”>
Column 2 info here
Column 2 info here
Column 2 info here
</div>
<div style=”width: 30%; padding: 0 10pt 0 0; float: right;”>
Column 3 info here
Column 3 info here
Column 3 info here
</div>

WordPress 二三事

介紹

WordPress 是一個開源部落格,加上不同外掛和模組,增強部落格功能和表達效果。

應用例子

WordPress Showcase
https://wordpress.org/showcase/

工具

WordPress — Blog Tool, Publishing Platform, and CMS
https://wordpress.org/
WordPress Plugin Directory
https://wordpress.org/plugins/
WordPress Themes Directory
https://wordpress.org/themes/
163 Free WordPress Themes
http://theme.wordpress.com/themes/sort/free/

關鍵字

wordpress XXXXX Shortcode
wordpress XXXXX Widget

外掛

請按此處

學習資料

WordPress Documentation
https://codex.wordpress.org/Main_Page

相關資訊

修改語言檔案(Edit .mo File)
Poedit http://poedit.net/
管理台轉換繁體中文
WORDPRESS\wp-config.php define(‘WPLANG’, ‘zh_TW’);
語言路徑
WORDPRESS\wp-content\languages\
圖片路徑
WORDPRESS\wp-content\uploads\
外掛路徑
WORDPRESS\wp-content\plugins\

ThinkSNS 3.1 安裝教學

2014-05-03_212916

版本: 3.1_20131108
平台: Windows 7 64bit
伺服器工具: AMPPS (PHP + MySQL)
資料夾: thinksns31a

到以下網址下載, 選擇 ThinkSNS_V3.1_20131108_28822.zip
http://demo.thinksns.com/t3/index.php?app=weiba&mod=Index&act=postDetail&post_id=640

2014-05-03_212737

解壓檔案到 X:\Ampps\www\thinksns31a

2014-05-03_212312

進入 thinksns31a 網址, 開始安裝,
http://localhost/thinksns31a

2014-04-24_101214

1. 安裝須知, 按 開始安裝ThinkSNS

2014-04-24_101223

2. 安裝許可協議, 按 下一步

2014-04-24_101230

3. 服務器配置

2014-04-24_101248

4. 數據庫配置和管理者資料

2014-04-24_101337

5. 帳戶資料參閱

2014-04-24_101351

6. 導入數據

2014-04-24_101401

7. 成功導入數據, 完成安裝.

2014-04-24_101415

系統登入介面, 以管理者身份登入.

2014-04-24_101451

ThinkSNS 操作介面

2014-04-24_101605

按 管理員(右上角)

2014-05-03_212920

再次輸入管理者資料

2014-04-24_101741

選擇 系統 -> 站點配置, 設定網站基本資料.

2014-04-24_101828

選擇 任務, 這裡是遊戲化設定.

2014-04-24_101842

請自行研究不同管理項目.

2014-04-24_101815

2014-04-24_101833

2014-04-24_101838

2014-04-24_101846

2014-04-24_101853

2014-04-24_101857

相關資料
遊戲化二三事

elgg 1.8 安裝教學

2014-04-18_233423

版本: 1.8.19
平台: Windows 7 64bit
伺服器工具: AMPPS (PHP + MySQL)
資料夾: elgg18b

到以下網址下載, 選擇 elgg-1.8.19.zip
http://elgg.org/download.php

2014-04-18_234153

解壓檔案到 X:\Ampps\www\elgg18b\

2014-05-01_200511

進入 phpmyadmin 建立 elgg18b 資料庫.
http://localhost/phpmyadmin/

2014-04-18_234903

2014-04-18_234944

進入elgg18b 網址, 開始安裝,
http://localhost/elgg18b/

1. Welcome, 按 Next

2014-04-18_234523

2. Requirements check, 按 Next

2014-04-18_234539

3.Database installation, 設定資料庫 (22資料表), 按 Next

2014-04-18_234636

4. Configure site 設定網站, 按 Next

在C:\Ampps\www\elgg18b\建立data資料夾

2014-04-18_235826

查閱相關設定,
Data Directory 填上 C:\Ampps\www\elgg18b\data
自行選擇 預設網站權限 Public / Private / Friends / Logged in users

2014-04-19_000351

5. Create admin account, 按 Next
username: admin
password: password

2014-04-19_000504

6. Finished, 按 Go To Site

2014-04-19_000603

elgg18b 登入畫面
http://localhost/elgg18b/

2014-05-01_204625

本來想加入”繁體中文”, 可是跟著指示安裝和網上找尋方法,
也無法使用,繼續使用英文, 如有網友解決此情況, 請聯絡本人, 萬分感激.
以下是”繁體中文”相關資料.

繁體中文Traditional Chinese Lauguage Pack for V1.8/V1.8.1 (plus V1.7 & V1.7.1 version) for Elgg 1.8
http://community.elgg.org/plugins/487207/1.8.1/%E7%B9%81%E9%AB%94%E4%B8%AD%E6%96%87traditional-chinese-lauguage-pack-for-v18v181-plus-v17-v171-version

2014-04-19_233650

請到以下網址, 下載遊戲化(Gamification)相關模組

hypeFramework 1.8 for Elgg 1.8
http://community.elgg.org/plugins/798954/1.8.5/hypeframework-18
http://www.hypeframework.org/

hypeGameMechanics for Elgg 1.8
http://community.elgg.org/plugins/837519/1.8.5/hypegamemechanics-18

2014-04-19_001834

2014-05-01_210555

解壓檔案到 C:\Ampps\www\elgg18b\mod

2014-04-19_001938

以管理者身份登入 elgg18b 系統
http://localhost/elgg18b/

2014-05-01_204625

進入 Administration (右上角)

2014-05-01_212444

選擇 Settings -> Basic Settings
查閱和修改相關設定

2014-04-19_002539

選擇 Settings -> Advanced Settings
查閱和修改相關設定

2014-04-19_002603

關閉公開註冊 (按所需選擇)

不剔選”Allow new users to register”

2014-05-01_223133

2014-04-24_1109342014-04-24_110944

預設使用者新增內容權限 (按所需選擇)
The default access permissions: Public / Friends / Logged in users / Private

2014-04-24_111205

新增使用者 (按所需選擇)
選擇 Administer -> Users -> Add New User

2014-04-24_110644

設定使用者資料

2014-04-24_110537

使用者列表
選擇 Administer -> Users -> Newest

2014-04-24_110821

進入 Administration, 選擇 Plugins

2014-04-19_002115

選擇 Newest, 按 Sort

2014-04-19_002125

首先 hypeFramework, 按Activate

2014-04-19_002208

之後 hypeGameMechanics, 按Activate
進入 Settings

2014-04-19_002247

出現一頁很長…很長的表格,
這裡設定使用者做什麼動作, 就可得到多少分數.
設定完成後, 按 Save

2014-04-19_002404

進入 View Site

2014-05-01_225226

進入 Profile, 顯示使用者相關資料

2014-05-01_225345

進入 Badges, 設定獎章(Badges)

2014-05-01_151343

按 Create a new badge

2014-05-01_151349

獎章圖案 Badge image:
獎章名稱 Name:
獎章描述 Description:
獎章類型 Badge Type: Status / Experience / For Sale / Surprise

2014-05-01_154311

設定使用者取得獎章條件, 完成後按 Submit

—-
Requirements to acquire this badge
Rule definitions
Action
Number of times this action must be performed

2014-05-01_154319

Availability (Access Level): Public / Friends / Logged in users / Private

2014-05-01_154327

獎章建立完成.

2014-05-01_154343

相關資料
遊戲化二三事

Zurmo CRM 安裝教學

2014-04-11_212104

 

版本: 2.6.5
平台: Windows 7 64bit
伺服器工具: AMPPS (PHP + MySQL)
資料夾: zurmob

升級檔案 (2.6.5 -> 2.7.0) (待續)

到以下網址下載, 選擇zurmo-stable-2.6.5.c5257ee612c5.zip
http://zurmo.org/download

 

解壓檔案到 X:\Ampps\www\zurmob

2014-04-11_222017

 

相關安裝資料
http://zurmo.org/wiki/installation-requirements
http://zurmo.org/wiki/installing-dependencies-on-windows
http://zurmo.org/wiki/installing-zurmo

 

附加工具 (待續)
Memcache 安裝教學
PHP 設定

 

輸入本機網址, 開始安裝,
http://localhost/zurmob

2014-04-11_222117

2014-04-11_222249

請留意
管理者身份: super

2014-04-11_2231142014-04-11_223127

安裝完成.

2014-04-11_223137

 登入系統

2014-04-11_223151

 選擇地區

2014-04-11_223246

 操作介面

2014-04-11_223300

 

相關資料
遊戲化二三事

 

遊戲化二三事

介紹
遊戲化是一種新概念或新商業模式, 把生活和工作加入遊戲元素, 增加過程中趣味, 吸引繼續參與.目前在香港應用遊戲化不算多, 可能是大公司採用.
會否和中國傳統觀念”工作時工作, 遊戲時遊戲”有矛盾?而本人未來如何開始和參與這個概念放到在生活和工作.

定義:
遊戲化是在非遊戲環境中加入遊戲元素和遊戲設計技術的應用.
Gamification is the use of game elements and game design techniques in non-game contexts.

六個「遊戲化」的步驟
定義企業目標。(Define business objectives.)
描寫希望的行為。(Delineate target behaviors.)
了解、描述玩家。(Describe your players.)
設計遊戲回饋、鼓勵機制。(Devise your activity loops.)
別忘了本質上的樂趣。(Don’t forget the fun.)
使用適當的工具。(Deploy the appropriate tools.)

關鍵字
game elements
game design techniques
non-game contexts
Point, Badge, Leaderboard

應用例子

NIKE+
https://secure-nikeplus.nike.com/plus/

Zombies, Run! 2
https://www.zombiesrungame.com/

http://www.thefuntheory.com/
The Fun Theory 樂趣理論 _世上最深的垃圾桶 (中文翻譯)
– https://www.youtube.com/watch?v=mHttAo2Ecm0
The fun theory 樂趣理論_鋼琴樓梯 (中文翻譯)
– https://www.youtube.com/watch?v=J49YtdxqN58

學習資料

Coursera Gamification
Kevin Werbach, Associate Professor , Legal Studies, University of Pennsylvania
https://www.coursera.org/course/gamification

Gamification Design
by Victor Manrique, Isidro Rodrigo, Dr. Oscar Garcia-Panella, emiliano labrador, Montecarlo -, Andrzej Marczewski, Dr. Flavio Escribano, and Cristina Pagés
https://iversity.org/courses/gamification-design

參考資料

Bunchball
http://www.bunchball.com/

Badgeville
http://badgeville.com/

BigDoor
http://bigdoor.com/

Foursquare
https://foursquare.com/
For The Win: How Game Thinking Can Revolutionize Your Business
Kevin Werbach, Dan Hunter
http://wdp.wharton.upenn.edu/books/for-the-win/

Gamification by Design: Implementing Game Mechanics in Web and Mobile Apps
http://shop.oreilly.com/product/0636920014614.do
Gabe Zichermann, Christopher Cunningham

從思考、設計到行銷,都要玩遊戲!:Gamification遊戲化的時代
井上明人
http://www.books.com.tw/products/0010617893

GAME CHANGE
PHD, Craig Atkinson, Malcolm Devoy, Mark Holden, Frances Ralston-Good, Alasdair Douglas Reid, Chris Stephenson
http://www.arterymedia.co.uk/clients/phd/gamechangebook/

Reality is Broken: Why Games Make Us Better and How They Can Change the World
Jane McGonigal
http://www.amazon.com/Reality-Is-Broken-Better-Change/dp/0143120611
http://janemcgonigal.com/

The Difference Between Gamification And Game-Based Learning
http://www.teachthought.com/technology/difference-gamification-game-based-learning/

A 6-Step Process For Adding Gamification To Your Classroom
http://www.teachthought.com/video-games-2/6-step-process-for-adding-gamification-to-your-classroom/

什麼是遊戲化 (gamification)?
http://sdachen.blogspot.hk/2013/10/what-is-gamification.html

遊戲化是一種方式,不是目的
http://dclick.fourdesire.com/2013/05/31/gamification-is-not-purpose?ref=next

游戏化学习更有趣
http://www.daxuecool.com/html/news/cengci/youxihua-153350.html

遊戲化:快樂工作還是玩物喪志?
http://www.knowledgeatwharton.com.cn/index.cfm?fa=article&articleid=2911&languageid=5

「遊戲化」:不只是使用者經驗風潮
http://www.bnext.com.tw/article/view/id/27863

遊戲化(Gamification)並不是你想像的那樣
http://www.inside.com.tw/2011/01/23/nature-of-gamification

「遊戲化」辦公時代即將來臨?
https://hk.finance.yahoo.com/news/%E3%80%8C%E9%81%8A%E6%88%B2%E5%8C%96%E3%80%8D%E8%BE%A6%E5%85%AC%E6%99%82%E4%BB%A3%E5%8D%B3%E5%B0%87%E4%BE%86%E8%87%A8%EF%BC%9F-005254975.html

PHD工作遊戲化 員工效率增
http://www.skypost.hk/newsDetail/headline?headline=PHD%E5%B7%A5%E4%BD%9C%E9%81%8A%E6%88%B2%E5%8C%96%20%E5%93%A1%E5%B7%A5%E6%95%88%E7%8E%87%E5%A2%9E

相關資料
Zurmo CRM 安裝教學

elgg 1.8 安裝教學

ThinkSNS 3.1 安裝教學

OpenEMR 安裝教學

2014-04-11_154805

1. 建議使用Firefox, 在本機(Localhost)作示範安裝.

版本: 4.1.2(3)
平台: Windows 7 64bit
伺服器工具: AMPPS (PHP + MySQL)
資料夾: openemr41c

如選擇伺服器工具XAMPP到以下網址查看安裝方法.
http://www.open-emr.org/wiki/index.php/OpenEMR_4.1.2_Windows_Installation
選擇安裝在虛擬機器運行.(版本: 4.1.1)
http://www.open-emr.org/wiki/index.php/OpenEMR_4.1.1_Virtual_Appliance
檔案下載
http://sourceforge.net/projects/openemr/files/OpenEMR%20Virtual%20Appliance/4.1.1/
也可到以下網址作試用.
http://www.bradymd.com/appliance/demos.shtml
OpenEMR使用手冊
http://www.open-emr.org/wiki/index.php/OpenEMR_4.1.2_Users_Guide

2. 到以下網址下載系統, 選擇 openemr-4.1.2.zip
http://www.open-emr.org/wiki/index.php/OpenEMR_Downloads

2014-04-11_154823

3. 解壓檔案到 X:\Ampps\www\openemr41c

2014-04-11_151419

3a. 附加工具 (待續)
Tar
http://pear.php.net/package/Archive_Tar/download
\interface\main\Archive
Pear
http://pear.php.net/package/PEAR/download

4. 輸入本機網址, 開始安裝, 檢查環境狀態
http://localhost/openemr41c/

2014-04-11_135538

按 Continue

5. 資料庫設定

Step 1
可以選擇
Have setup create the database (建立資料庫)
I have already created the database (已建立資料庫)

選擇

Have setup create the database (建立資料庫)

2014-04-11_135547

按 Continue

Step 2

填入相關資料, 按 Continue

2014-04-11_140054

Step 3
資料庫安裝完成, 按 Continue

2014-04-11_141412

Step 4
相關安裝資料, 按 Continue

2014-04-11_143255

Step 5
PHP設定
X:\Ampps\apache\php.ini
X:\Ampps\conf\php-5.3.ini(AMPPS預設版本)

2014-04-11_143451

詳細可到以下網址查看
http://www.open-emr.org/wiki/index.php/FAQ#What_are_the_correct_PHP_settings_.28can_be_found_in_the_php.ini_file.29.3F

Step 6

環境設定, 按 Continue

2014-04-11_143542

6.安裝完成, 按 Click here to start using OpenEMR

2014-04-11_143620

7. 系統首頁, 登入帳戶

2014-04-11_143725

8. OpenEMR 介面

2014-04-11_143757

9. 按登出(右上角)

2014-04-11_143816

10. 更新版本
目前版本4.1.2(3), 為保障系統安全, 定期查看更新檔案, 最新版本4.1.2(5).

2014-04-11_143832

到以下網址, 下載 4-1-2-Patch-5.zip
http://www.open-emr.org/wiki/index.php/OpenEMR_Patches

2014-04-11_144256

解壓檔案, 複製所有檔案到 X:\Ampps\www\openemr41c

2014-04-11_144851

回到Firefox, 輸入以下網址,更新資料庫
http://localhost/openemr41c/sql_patch.php

2014-04-11_145305

資料庫更新完成, 按 Log in

詳細可到以下網址查看
http://www.open-emr.org/wiki/index.php/OpenEMR_Patches#Installation_instructions

11.系統首頁, 查看有否更新版本

2014-04-11_145422

相關資料

醫療管理系統

醫療管理系統

早前有朋友問有沒有一些醫療管理系統可介紹, 在網上找到一些資源作參考.

關鍵字
Electronic Medical Record (EMR)
Hospital Information System (HIS)
Health Information System

參考資料

eHealth System 醫健通
https://apps.hcv.gov.hk/

電子健康記錄統籌處
http://www.ehealth.gov.hk/tc/home.html
公私營醫療合作-醫療病歷互聯試驗計劃
http://www3.ha.org.hk/ppp/ppiepr_a.aspx?lang=tchi

Electronic health record
http://en.wikipedia.org/wiki/Electronic_health_record

List of open-source healthcare software
http://en.wikipedia.org/wiki/List_of_open-source_healthcare_software

找到一些開源系統和他們需用到工具.

OpenEMR http://www.open-emr.org/
PHP + MySQL
care2x http://www.care2x.org/
PHP + MySQL
HKMA-CMS http://cms3.hkma.org/
Java + Tomcat + MySQL
OpenMRS http://openmrs.org/
Java + Tomcat + MySQL
GNU Health http://health.gnu.org/
Python + Tryton + PostgreSQL
openEHR http://www.openehr.org
C#, .Net Framework

相關資料

OpenEMR 安裝教學