ソーシャルゲームのフロントエンドとASP.NET MVC (Lite)

Room metro Tokyo #3 (2014-01-18)

Transcript

1. View Slide

2. ( )
   http://www.misuzilla.org/
   

   View Slide

3. View Slide

4. ( )
   

   View Slide

5. View Slide

6. View Slide

7. C# 5.0 (Razor )
   Sass
   TypeScript
   

   View Slide

8. View Slide

9. Visual Studio 2013 Premium
   SassyStudio
   Prepros
   

   View Slide

10. GUI
    GUI
    

    View Slide

11. View Slide

12. HTML
    

    View Slide

13. View Slide

14. CSS HTML
    

    View Slide

15. MindBEMding
    

    View Slide

16. View Slide

17. BEM HTML/CSS
    

    View Slide

18. Element
    Element
    Element
    Element
    Element
    Block:
    Element:
    Modifier:
    

    View Slide

19. 
    Hauhau
    Gaogao
    
    
    Item1
    Item2(Selected)
    
    

    View Slide

20. 
    Hauhau
    Gaogao
    
    
    Item1
    Item2(Selected)
    
    

    View Slide

21. View Slide

22. MindBEMding
    

    View Slide

23. View Slide

24. View Slide

25. docomo CSS
    

    View Slide

26. View Slide

27. C# HTML
    https://github.com/mayuki/Cartelet
    

    View Slide

28. var content = @
    1
    2
    ";
    var htmlFilter = new HtmlFilter();
    htmlFilter.AddHandler("li:nth-child(2n)",
    (ctx, nodeInfo) => { nodeInfo.Attributes["style"] = "color:red;"; return true; });
    var sw = new StringWriter();
    htmlFilter.Execute(new CarteletContext(content, sw), HtmlParser.Parse(content));
    sw.ToString();
    //
    // 1
    // 2
    //
    

    View Slide

29. CSS HTML style
    

    View Slide

30. View Slide

31. HtmlHelper
    

    View Slide

32. WebViewPage ( )
    @inherit ( )
    

    View Slide

33. Html.Raw Considered Harmful
    

    View Slide

34. View Slide

35. TagBuilder ( )
    

    View Slide

36. View Slide

37. View Slide