{"id":1576,"date":"2019-04-09T19:00:21","date_gmt":"2019-04-09T23:00:21","guid":{"rendered":"http:\/\/matthannan.net\/blog\/?p=1576"},"modified":"2019-04-09T19:00:31","modified_gmt":"2019-04-09T23:00:31","slug":"from-the-real-world-to-the-web","status":"publish","type":"post","link":"https:\/\/matthannan.net\/blog\/from-the-real-world-to-the-web\/","title":{"rendered":"From the Real World to the Web"},"content":{"rendered":"\n<p>Part of my quest for <del>world domination<\/del>, er, getting my <a href=\"https:\/\/matthannan.net\/blog\/making-the-computer-see\/\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\"Raspberry Pi to tell me about things in my basement (opens in a new tab)\">Raspberry Pi to tell me about things in my basement<\/a> without my having to actually go down there is just about complete.<\/p>\n\n\n\n<p>I bought a temperature and humidity sensor from <a rel=\"noreferrer noopener\" aria-label=\"Adafruit (opens in a new tab)\" href=\"https:\/\/learn.adafruit.com\/adafruit-sht31-d-temperature-and-humidity-sensor-breakout\/python-circuitpython\" target=\"_blank\">Adafruit<\/a> and finally got around to wiring it up and getting the Python code written to read it. I took the coding step by step. First getting it working from a Python repl, then a super simple script, then a more complex script that saved the data to a csv file. At that point I was a bit stuck. I figured I was looking at MySQL and Apache, and I did try. And try. And try. And try to make it work, but I couldn&#8217;t. Then I started thinking about how <a href=\"https:\/\/www.sqlite.org\/index.html\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\"sqlite3 (opens in a new tab)\">sqlite3<\/a> comes baked into Python. Turns out, it was pretty easy to get that working.<\/p>\n\n\n\n<p>But I was still stuck with how to get the data from the database and display it in a graph on a (internal) web page. Apache was like using dynamite when you really need a ball-peen hammer. Finally, after nights of searching and experimenting, I found <a rel=\"noreferrer noopener\" aria-label=\"this guy's Medium site (opens in a new tab)\" href=\"https:\/\/medium.com\/@rovai\/from-data-to-graph-a-web-jorney-with-flask-and-sqlite-6c2ec9c0ad0\" target=\"_blank\">this guy&#8217;s Medium site<\/a> for doing just exactly what I wanted! I couldn&#8217;t believe it! EXACTLY what I wanted to do. And, it had the added bonus of tossing Apache aside and using <a href=\"http:\/\/flask.pocoo.org\/\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\"Flask (opens in a new tab)\">Flask<\/a>, which is more Python and new ground for me. I had to debug some of his code to get it running, and I am considering what I have a total beta, but the real point was figuring out how to get data from a database and into a graph on a web page. Mission accomplished!<\/p>\n\n\n\n<p>Now to address the CSS&#8230;<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1906\" height=\"996\" data-attachment-id=\"1578\" data-permalink=\"https:\/\/matthannan.net\/blog\/from-the-real-world-to-the-web\/tnhpage\/\" data-orig-file=\"https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2019\/04\/tnhPage.png?fit=1906%2C996&amp;ssl=1\" data-orig-size=\"1906,996\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"tnhPage\" data-image-description=\"\" data-image-caption=\"\" data-large-file=\"https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2019\/04\/tnhPage.png?fit=640%2C334&amp;ssl=1\" src=\"https:\/\/i2.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2019\/04\/tnhPage.png?fit=640%2C334&amp;ssl=1\" alt=\"\" class=\"wp-image-1578\" srcset=\"https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2019\/04\/tnhPage.png?w=1906&amp;ssl=1 1906w, https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2019\/04\/tnhPage.png?resize=300%2C157&amp;ssl=1 300w, https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2019\/04\/tnhPage.png?resize=768%2C401&amp;ssl=1 768w, https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2019\/04\/tnhPage.png?resize=1024%2C535&amp;ssl=1 1024w, https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2019\/04\/tnhPage.png?w=1280&amp;ssl=1 1280w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>Part of my quest for world domination, er, getting my Raspberry Pi to tell me about things in my basement without my having to actually go down there is just about complete. I bought a temperature and humidity sensor from &hellip; <a href=\"https:\/\/matthannan.net\/blog\/from-the-real-world-to-the-web\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"advanced_seo_description":"","jetpack_seo_html_title":"","jetpack_seo_noindex":false,"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[5],"tags":[415,416,418,414,183,313,326,419,417],"class_list":["post-1576","post","type-post","status-publish","format-standard","hentry","category-geek","tag-adafruit","tag-flask","tag-humidity","tag-matplotlib","tag-projects","tag-python","tag-raspberrypi","tag-sensor","tag-temperature"],"jetpack_featured_media_url":"","jetpack_shortlink":"https:\/\/wp.me\/p2NxlE-pq","jetpack_sharing_enabled":true,"jetpack_likes_enabled":true,"jetpack-related-posts":[{"id":2302,"url":"https:\/\/matthannan.net\/blog\/modernizing-my-temperature-and-humidity-sensor\/","url_meta":{"origin":1576,"position":0},"title":"Modernizing My Temperature and Humidity Sensor","author":"matthannan","date":"18 September 2021","format":false,"excerpt":"My basement temperature and humidity sensor has been up and running for 2.5 years now with hardly a hiccup at all. But, it is time for an upgrade. I've made some tweaks to the page over the years, but I 've grown less and less happy with the matplotlib implementation.\u2026","rel":"","context":"In &quot;Geek&quot;","block_context":{"text":"Geek","link":"https:\/\/matthannan.net\/blog\/category\/geek\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2021\/09\/tnhPage_Grafana_InfluxDB-1.png?resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2021\/09\/tnhPage_Grafana_InfluxDB-1.png?resize=350%2C200 1x, https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2021\/09\/tnhPage_Grafana_InfluxDB-1.png?resize=525%2C300 1.5x, https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2021\/09\/tnhPage_Grafana_InfluxDB-1.png?resize=700%2C400 2x, https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2021\/09\/tnhPage_Grafana_InfluxDB-1.png?resize=1050%2C600 3x, https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2021\/09\/tnhPage_Grafana_InfluxDB-1.png?resize=1400%2C800 4x"},"classes":[]},{"id":2464,"url":"https:\/\/matthannan.net\/blog\/what-i-did-on-my-mid-summer-vacation-day-5\/","url_meta":{"origin":1576,"position":1},"title":"What I Did on My Mid-Summer Vacation: Day 5","author":"matthannan","date":"31 August 2022","format":false,"excerpt":"Forecast for the day is a heat advisory. If we haven't already been under one, having one today was really bad news. I took advantage of not being able to work out in the yard to get caught up on the checking account and paying the couple of bills that\u2026","rel":"","context":"In &quot;Geek&quot;","block_context":{"text":"Geek","link":"https:\/\/matthannan.net\/blog\/category\/geek\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2022\/08\/mqtt-publish-subscribe-3.png?fit=1024%2C320&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2022\/08\/mqtt-publish-subscribe-3.png?fit=1024%2C320&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2022\/08\/mqtt-publish-subscribe-3.png?fit=1024%2C320&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2022\/08\/mqtt-publish-subscribe-3.png?fit=1024%2C320&ssl=1&resize=700%2C400 2x"},"classes":[]},{"id":1158,"url":"https:\/\/matthannan.net\/blog\/mongodb-and-python-in-data-visualization\/","url_meta":{"origin":1576,"position":2},"title":"MongoDB and Python in Data Visualization","author":"matthannan","date":"24 August 2017","format":false,"excerpt":"This is an interesting web site discussing the use of Python and MongoDB in data visualization. I am getting very comfortable with Python and I have just started playing with MongoDB, so looking at examples of how I can start to generate data visualizations out of these tools is my\u2026","rel":"","context":"In &quot;Geek&quot;","block_context":{"text":"Geek","link":"https:\/\/matthannan.net\/blog\/category\/geek\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":1435,"url":"https:\/\/matthannan.net\/blog\/making-the-computer-see\/","url_meta":{"origin":1576,"position":3},"title":"Making the computer &#8220;see&#8221;.","author":"matthannan","date":"13 August 2018","format":false,"excerpt":"I am currently down the OpenCV rabbit hole. I want to velcro a Rasp Pi to my oil tank and have it \"see\" how much oil is in there. I don't want to see a picture of the meter. That would be too easy. I want something of an alpha-numeric\u2026","rel":"","context":"In &quot;Geek&quot;","block_context":{"text":"Geek","link":"https:\/\/matthannan.net\/blog\/category\/geek\/"},"img":{"alt_text":"OpenCV","src":"https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2018\/08\/opencv-300x212.png?resize=350%2C200","width":350,"height":200},"classes":[]},{"id":1307,"url":"https:\/\/matthannan.net\/blog\/python\/","url_meta":{"origin":1576,"position":4},"title":"Python","author":"matthannan","date":"1 February 2018","format":false,"excerpt":"I am very far behind on this and I have many, many blog posts to write, but this is what I did tonight. I am currently reading \"Automate the Boring Stuff With Python\" (this is basically a required text), taking the Python course on CodeAcademy.com, just about caught up with\u2026","rel":"","context":"In &quot;Geek&quot;","block_context":{"text":"Geek","link":"https:\/\/matthannan.net\/blog\/category\/geek\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2018\/02\/growthmajorlanguages-1-1024x878.png?fit=770%2C660&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2018\/02\/growthmajorlanguages-1-1024x878.png?fit=770%2C660&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2018\/02\/growthmajorlanguages-1-1024x878.png?fit=770%2C660&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/matthannan.net\/blog\/wp-content\/uploads\/2018\/02\/growthmajorlanguages-1-1024x878.png?fit=770%2C660&ssl=1&resize=700%2C400 2x"},"classes":[]},{"id":1129,"url":"https:\/\/matthannan.net\/blog\/softether-vpn-part-2\/","url_meta":{"origin":1576,"position":5},"title":"SoftEther VPN, Part 2","author":"matthannan","date":"12 July 2017","format":false,"excerpt":"So, SoftEther VPN has been cranking along nicely for me for months now. I really love it. It stays out of the way and does exactly what it is supposed to do. I just bought a Raspberry Pi 3 Model B. I did this for a couple of reasons. The\u2026","rel":"","context":"In &quot;Life&quot;","block_context":{"text":"Life","link":"https:\/\/matthannan.net\/blog\/category\/life\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"_links":{"self":[{"href":"https:\/\/matthannan.net\/blog\/wp-json\/wp\/v2\/posts\/1576","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/matthannan.net\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/matthannan.net\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/matthannan.net\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/matthannan.net\/blog\/wp-json\/wp\/v2\/comments?post=1576"}],"version-history":[{"count":1,"href":"https:\/\/matthannan.net\/blog\/wp-json\/wp\/v2\/posts\/1576\/revisions"}],"predecessor-version":[{"id":1579,"href":"https:\/\/matthannan.net\/blog\/wp-json\/wp\/v2\/posts\/1576\/revisions\/1579"}],"wp:attachment":[{"href":"https:\/\/matthannan.net\/blog\/wp-json\/wp\/v2\/media?parent=1576"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/matthannan.net\/blog\/wp-json\/wp\/v2\/categories?post=1576"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/matthannan.net\/blog\/wp-json\/wp\/v2\/tags?post=1576"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}