HomePage.vala 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120
  1. using Spry;
  2. using Inversion;
  3. /**
  4. * HomePage - Documentation landing page for the Spry framework
  5. *
  6. * Clean, minimal design focused on helping developers get started
  7. * with Spry quickly.
  8. */
  9. public class HomePage : PageComponent {
  10. public override string title { get { return "Spry - A Component-Based Web Framework for Vala"; } }
  11. public const string ROUTE = "/";
  12. private ComponentFactory factory = inject<ComponentFactory>();
  13. public override string markup { get {
  14. return """
  15. <div class="doc-content">
  16. <!-- Hero Section -->
  17. <section class="home-hero">
  18. <h1 class="hero-title">Spry</h1>
  19. <p class="hero-tagline">A component-based web framework for Vala</p>
  20. </section>
  21. <!-- Introduction -->
  22. <section class="doc-section">
  23. <p class="intro">
  24. Spry is a web framework that lets you build dynamic, interactive web applications
  25. using Vala. It features HTMX integration for reactive UIs, dependency injection
  26. for clean architecture, and a component model that keeps markup and logic together.
  27. </p>
  28. <p>
  29. Whether you're building a simple web service or a complex interactive application,
  30. Spry provides the tools you need with full type safety and native performance.
  31. </p>
  32. </section>
  33. <!-- Quick Links -->
  34. <section class="doc-section">
  35. <h2>Documentation</h2>
  36. <div class="quick-links">
  37. <a href="/components/overview" class="quick-link-card">
  38. <h3>Components</h3>
  39. <p>Learn about Spry's component model, lifecycle, and how to build interactive UIs.</p>
  40. </a>
  41. <a href="/page-components/overview" class="quick-link-card">
  42. <h3>Page Components</h3>
  43. <p>Understand how to create pages and use templates for consistent layouts.</p>
  44. </a>
  45. <a href="/static-resources/overview" class="quick-link-card">
  46. <h3>Static Resources</h3>
  47. <p>Serve CSS, JavaScript, images, and other static assets efficiently.</p>
  48. </a>
  49. </div>
  50. </section>
  51. <!-- Get Started Code Example -->
  52. <section class="doc-section">
  53. <h2>Get Started</h2>
  54. <p>
  55. Here's a minimal "Hello World" Spry application to get you started:
  56. </p>
  57. <spry-component name="CodeBlockComponent" sid="hello-code"/>
  58. </section>
  59. <!-- Features -->
  60. <section class="doc-section">
  61. <h2>Why Spry?</h2>
  62. <ul class="features-list">
  63. <li>
  64. <strong>Type-Safe</strong> — Full Vala type safety catches errors at compile time,
  65. not runtime.
  66. </li>
  67. <li>
  68. <strong>Component-Based</strong> — Build encapsulated, reusable components with
  69. markup and logic in one place.
  70. </li>
  71. <li>
  72. <strong>HTMX Integration</strong> — Create dynamic interfaces without writing
  73. JavaScript. HTMX handles the complexity.
  74. </li>
  75. <li>
  76. <strong>Dependency Injection</strong> — Clean architecture with Inversion of
  77. Control for services and stores.
  78. </li>
  79. <li>
  80. <strong>Native Performance</strong> — Compiled to native code for maximum
  81. throughput and minimal resource usage.
  82. </li>
  83. <li>
  84. <strong>Free & Open Source</strong> — Released under a permissive license,
  85. free to use for any project.
  86. </li>
  87. </ul>
  88. </section>
  89. </div>
  90. """;
  91. }}
  92. public override async void prepare() throws Error {
  93. var helloCode = get_component_child<CodeBlockComponent>("hello-code");
  94. helloCode.language = "Vala";
  95. helloCode.code = "public class HelloPage : PageComponent {\n" +
  96. " public override string markup { get {\n" +
  97. " return \"\"\"<!DOCTYPE html>\n" +
  98. "<html>\n" +
  99. "<body>\n" +
  100. " <h1>Hello, Spry!</h1>\n" +
  101. "</body>\n" +
  102. "</html>\"\"\";\n" +
  103. " }}\n" +
  104. "}\n\n" +
  105. "// In Main.vala\n" +
  106. "spry_cfg.add_page<HelloPage>(new EndpointRoute(\"/\"));";
  107. }
  108. }