The latest articles on DEV Community by Bobby Shackleton (@bobsterjsdev). https://dev.to/bobsterjsdev https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F720001%2F8616136b-6776-4215-9205-774e2f2324fc.jpeg https://dev.to/bobsterjsdev en Bobby Shackleton Wed, 06 Oct 2021 18:48:17 +0000 https://dev.to/bobsterjsdev/bobsterjs-weather-released-26od https://dev.to/bobsterjsdev/bobsterjs-weather-released-26od <p>BobsterJS Weather Application has been released and can be viewed at <a href="https://weather.bobsterjs.ml/">https://weather.bobsterjs.ml/</a></p> <p>Over on our twitter page we sent out a tweet earlier today informing of the release<br> </p> <blockquote class="ltag__twitter-tweet"> <div class="ltag__twitter-tweet__media"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--U1v1g97S--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://pbs.twimg.com/media/FBCX6kCVIAEYmHj.png" alt="unknown tweet media content"> </div> <div class="ltag__twitter-tweet__main"> <div class="ltag__twitter-tweet__header"> <img class="ltag__twitter-tweet__profile-image" src="https://res.cloudinary.com/practicaldev/image/fetch/s--WJfyuIyz--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://pbs.twimg.com/profile_images/1318920101618503681/3g7X0sID_normal.jpg" alt="BobsterJS profile image"> <div class="ltag__twitter-tweet__full-name"> BobsterJS </div> <div class="ltag__twitter-tweet__username"> @bobsterjs </div> <div class="ltag__twitter-tweet__twitter-logo"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--ir1kO05j--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev.to/assets/twitter-f95605061196010f91e64806688390eb1a4dbc9e913682e043eb8b1e06ca484f.svg" alt="twitter logo"> </div> </div> <div class="ltag__twitter-tweet__body"> BobsterJS Weather App released! </div> <div class="ltag__twitter-tweet__date"> 18:45 PM - 06 Oct 2021 </div> <div class="ltag__twitter-tweet__actions"> <a href="https://twitter.com/intent/tweet?in_reply_to=1445822520280555523" class="ltag__twitter-tweet__actions__button"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--fFnoeFxk--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev.to/assets/twitter-reply-action-238fe0a37991706a6880ed13941c3efd6b371e4aefe288fe8e0db85250708bc4.svg" alt="Twitter reply action"> </a> <a href="https://twitter.com/intent/retweet?tweet_id=1445822520280555523" class="ltag__twitter-tweet__actions__button"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--k6dcrOn8--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev.to/assets/twitter-retweet-action-632c83532a4e7de573c5c08dbb090ee18b348b13e2793175fea914827bc42046.svg" alt="Twitter retweet action"> </a> <a href="https://twitter.com/intent/like?tweet_id=1445822520280555523" class="ltag__twitter-tweet__actions__button"> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--SRQc9lOp--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev.to/assets/twitter-like-action-1ea89f4b87c7d37465b0eb78d51fcb7fe6c03a089805d7ea014ba71365be5171.svg" alt="Twitter like action"> </a> </div> </div> </blockquote> <p>All of our project files will be publicly available via our organisation's github.<br> </p> <div class="ltag-github-readme-tag"> <div class="readme-overview"> <h2> <img src="https://res.cloudinary.com/practicaldev/image/fetch/s--i3JOwpme--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev.to/assets/github-logo-ba8488d21cd8ee1fee097b8410db9deaa41d0ca30b004c0c63de0a479114156f.svg" alt="GitHub logo"> <a href="https://github.com/BobsterJS-DEV"> BobsterJS-DEV </a> / <a href="https://github.com/BobsterJS-DEV/weather-app"> weather-app </a> </h2> <h3> </h3> </div> <div class="ltag-github-body"> <div id="readme" class="md"> <h1> BobsterJS Weather Application</h1> <h2> How To Setup</h2> <ul> <li>Navigate to <a href="https://openweathermap.org/" rel="nofollow">Open Weather Map</a> &amp; Create an Account</li> <li>Navigate to the <a href="https://home.openweathermap.org/api_keys" rel="nofollow">API key page</a> and create an api key or use one you already have</li> <li>Edit the <code>index.js</code> file and change the <code>API_KEY</code> variable to the api key</li> </ul> <h2> How To Serve The Web Page</h2> <ul> <li>Install <a href="https://nodejs.dev/" rel="nofollow">NodeJS</a> onto your local computer</li> <li>Run <code>npx serve</code> - This is a feature built in with NodeJS, so no extra installation needed</li> <li>This will serve the website onto your localhost/server</li> </ul> <h3> To-do</h3> <ul> <li>Turn the page into a PWA (Progressive Web App)</li> <li>Add more information on the website</li> </ul> </div> </div> <br> <div class="gh-btn-container"><a class="gh-btn" href="https://github.com/BobsterJS-DEV/weather-app">View on GitHub</a></div> <br> </div> <br> <p>You can support us by joining our discord and using our service :)<br> Discord Invite - <a href="https://discord.gg/78DMCjZatu">https://discord.gg/78DMCjZatu</a></p>