2013_iGEM_Wiki.pdf

Transcript

1. L i a n g B o Wa n g  Wiki Setup and Web Stuff © Liang Bo Wang, NTU iGEM Workshop. 2013 Under a Creative Commons Attribution-ShareAlike 3.0 Unported License. Slides online: http://goo.gl/ifAPa
2. © Liang Bo Wang, NTU iGEM Workshop. 2013
3. © Liang Bo Wang, NTU iGEM Workshop. 2013
4. © Liang Bo Wang, NTU iGEM Workshop. 2013 •  王亮博 •  NTU EE Dept. •  Bioinformatics and Biostatistics Core, CGM •  Coding •  2012 iGEM Wiki Setup •  宅宅一枚
5. © Liang Bo Wang, NTU iGEM Workshop. 2013
6. © Liang Bo Wang, NTU iGEM Workshop. 2013
7. © Liang Bo Wang, NTU iGEM Workshop. 2013
8. © Liang Bo Wang, NTU iGEM Workshop. 2013
9. © Liang Bo Wang, NTU iGEM Workshop. 2013
10. Notes for out web •  User friendly (? XD) •  Tools we use © Liang Bo Wang, NTU iGEM Workshop. 2013
11. © Liang Bo Wang, NTU iGEM Workshop. 2013 •  Some wiki syntax only •  In fact, we put a normal website on a wiki site. Wait… where is WIKI itself ?
12. Geek ONLY •  Leave the detailed or hard part for dry lab. •  Some sets up the style •  Others source this style and edit as normal wiki  © Liang Bo Wang, NTU iGEM Workshop. 2013
13. © Liang Bo Wang, NTU iGEM Workshop. 2013 Header Title Context Figures Equations Footer
14. Today’s Talk •  Basic knowledge to modern website construction •  Personal experience •  What should everyone do? •  Some advices to you guys © Liang Bo Wang, NTU iGEM Workshop. 2013
15. © Liang Bo Wang, NTU iGEM Workshop. 2013
16. Seriously, the tech part •  We use •  HTML5 + CSS3 + Javascript (mostly jQuery) © Liang Bo Wang, NTU iGEM Workshop. 2013 JS
17. © Liang Bo Wang, NTU iGEM Workshop. 2013
18. So… How should I grab this stuff? © Liang Bo Wang, NTU iGEM Workshop. 2013 •  Many good tutorials and books out there. •  HTML5 = 1 day •  CSS3 = 2 to ∞ days (tricky in practice) •  Javascript = 1 month or 1 day (thank god we have jQuery) •  Some hacks on iGEM wiki platform = 1 week •  Done by previous teams •  Wiki architecture •  PHP •  If you google … •  no W3Schools plz, they are hacker-friendly •  more on http://w3fools.com/
19. © Liang Bo Wang, NTU iGEM Workshop. 2013
20. © Liang Bo Wang, NTU iGEM Workshop. 2013
21. My experience •  A founder of Plurk @WebConf 2013  •  https://speakerdeck.com/alvinwoon/webconf-2013 © Liang Bo Wang, NTU iGEM Workshop. 2013 Note: late start late result traffic sucks no log no standard
22. Advice to you guys •  Get a sketch earlier. •  Log your experiments and results. •  maybe a good idea for software track •  Everyone should be capable of writing a wiki page. •  Finish uploading result before a week of deadline. •  traffic issue •  in fact many things should be done at that time. © Liang Bo Wang, NTU iGEM Workshop. 2013
23. © Liang Bo Wang, NTU iGEM Workshop. 2013
24. Note •  From a website to a web service •  Thoughts and Ideas •  Theme •  Web curation •  兜兜哲學, more on WebConf 2013 •  UX HCI •  User experience •  Human Computer Interface © Liang Bo Wang, NTU iGEM Workshop. 2013
25. Let imagination go wild •  D3.js •  http://d3js.org/ •  impress.js •  http://bartaz.github.com/impress.js/#/bored •  three.js •  http://mrdoob.github.com/three.js/ © Liang Bo Wang, NTU iGEM Workshop. 2013