about.html 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <!-- HTML Meta Tags -->
  5. <title>About WebStick</title>
  6. <meta name="description" content="A tiny web server powered by ESP8266, designed by tobychui">
  7. <meta name="viewport" content="width=device-width, initial-scale=1" >
  8. <!-- Facebook Meta Tags -->
  9. <meta property="og:url" content="https://imuslab.com">
  10. <meta property="og:type" content="website">
  11. <meta property="og:title" content="Welcome to WebStick!">
  12. <meta property="og:description" content="A tiny web server powered by ESP8266, designed by tobychui">
  13. <meta property="og:image" content=" ">
  14. <!-- Twitter Meta Tags -->
  15. <meta name="twitter:card" content="summary_large_image">
  16. <meta property="twitter:domain" content="imuslab.com">
  17. <meta property="twitter:url" content="https://imuslab.com">
  18. <meta name="twitter:title" content="Welcome to WebStick!">
  19. <meta name="twitter:description" content="A tiny web server powered by ESP8266, designed by tobychui">
  20. <meta name="twitter:image" content=" ">
  21. <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
  22. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.css" />
  23. <script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.js"></script>
  24. <style>
  25. .imgwrapper{
  26. max-height: 200px;
  27. overflow: hidden;
  28. }
  29. </style>
  30. </head>
  31. <body>
  32. <div class="navibar"></div>
  33. <div class="imgwrapper">
  34. <img src="img/wallpaper.jpg" class="ui fluid image">
  35. </div>
  36. <div class="ui container">
  37. <br>
  38. <h3>What is a WebStick?</h3>
  39. <p>WebStick is a USB stick form factor web server powered by a ESP12E/F module.
  40. The web content is serve over the SD card connected to the MCU via SPI link,
  41. providing basic HTTP web server function with less than 2W of power usage.</p>
  42. <h3>Why WebStick?</h3>
  43. <p>If you are just hosting a web server for personal use with a few occasional guests,
  44. you do not need a Raspberry Pi that draws 15W 24/7 just for this purpose. <br>
  45. Instead, a WebStick with ESP8266 is just enough to do the tasks.
  46. With the help of CDN and Caching, even a 2W MCU running over WiFi
  47. can provide relatively acceptable performance for basic HTTP web services.</p>
  48. <h3>Specification</h3>
  49. <table class="ui very basic celled collapsing table">
  50. <thead>
  51. <tr><th>Item</th>
  52. <th>Properties</th>
  53. </tr></thead>
  54. <tbody>
  55. <tr>
  56. <td data-label="">Power Requirement</td>
  57. <td data-label="">5V 1A</td>
  58. </tr>
  59. <tr>
  60. <td data-label="">Actual Power Draw</td>
  61. <td data-label="">around 2 - 3W</td>
  62. </tr>
  63. <tr>
  64. <td data-label="">Wireless Network Speed</td>
  65. <td data-label="">2 - 4 Mbps</td>
  66. </tr>
  67. <tr>
  68. <td data-label="">Max SD card size supported</td>
  69. <td data-label="">4GB</td>
  70. </tr>
  71. <tr>
  72. <td data-label="">SD card format</td>
  73. <td data-label="">FAT32</td>
  74. </tr>
  75. <tr>
  76. <td data-label="">Arduino IDE Programmable</td>
  77. <td data-label=""><i class="ui green check icon"></i></td>
  78. </tr>
  79. <tr>
  80. <td data-label="">Run PHP / nodejs</td>
  81. <td data-label=""><i class="ui red times icon"></i></td>
  82. </tr>
  83. <tr>
  84. <td data-label="">Recommended Number of Users</td>
  85. <td data-label="">less than 20 viewers per day</td>
  86. </tr>
  87. </tbody>
  88. </table>
  89. <a class="ui basic button" href="index.html">Back</a>
  90. <br><br>
  91. <p>This site is hosted on a WebStick designed by <a href="https://imuslab.com">imuslab</a></p>
  92. <br><br>
  93. </div>
  94. <script>
  95. $(".navibar").load("navi.html");
  96. </script>
  97. </body>
  98. </html>