<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Julia Flash</title>
    <description>The latest articles on DEV Community by Julia Flash (@juliathepm).</description>
    <link>https://dev.to/juliathepm</link>
    <image>
      <url>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%2F135797%2F4098841b-5d51-4843-94ce-78d1f8c5508b.jpeg</url>
      <title>DEV Community: Julia Flash</title>
      <link>https://dev.to/juliathepm</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/juliathepm"/>
    <language>en</language>
    <item>
      <title>🛸 What is Distributed Cloud</title>
      <dc:creator>Julia Flash</dc:creator>
      <pubDate>Sun, 07 Mar 2021 23:00:05 +0000</pubDate>
      <link>https://dev.to/ibmdeveloper/what-is-distributed-cloud-2368</link>
      <guid>https://dev.to/ibmdeveloper/what-is-distributed-cloud-2368</guid>
      <description>&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2Fx1A3d5n.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2Fx1A3d5n.png" alt="SOME HISTORY OF CONTAINERS first off in 2011 Openshift Red Hat launches first enterprise PaaS based on Linux containers then in 2013 Solomon Hykes debutes Docker at PyCon to run, create and manage containers on an operating system then in 2014 Google announces K8s, a platform that automates scaling, managing, updating and the removal of containers then in 2019 Kubernetes-based hybrid-cloud solutions roll out such as Google Anthos , Aws Outposts, IBM Cloud Paks and Azure Arc and 2021 you have Kubernetes standardizes deployment by providing a common layer of abstraction across different environments / physical devices"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;This is an infographic I made (with alt text) to show the evolving landscape that led to the distributed cloud model.&lt;/p&gt;

&lt;p&gt;The distributed cloud computing model was formally defined by Gartner in 2019 as a new trend in cloud computing. You can see with the Wayback Machine that a lot of descriptions on web pages included distributed cloud starting around 2014. &lt;/p&gt;

&lt;p&gt;Distributed cloud is different than distributed computing, which is when a bunch of computers working together as a single system/process in order to maximize computing performance. &lt;/p&gt;

&lt;p&gt;The advent of containerization was a key development to the distributed cloud computing model being formally defined recently. Containers provide the ability to encapsulate applications to port across multiple clouds, data centers and edge locations. This is great but there is a lot to manage too along with that. &lt;/p&gt;

&lt;h3&gt;
  
  
  So what is distributed cloud?
&lt;/h3&gt;

&lt;p&gt;Distributed cloud is the extension of public cloud infrastructure that can be deployed not only on your cloud provider's infrastructure but also at an on-prem location like a data center, another cloud providers' public cloud, a colocation data center or at edge locations. All of these deployments across the various environments are managed from a single control plane.&lt;/p&gt;

&lt;p&gt;Kubernetes has been the strongest player in managing and orchestrating containerized workloads by providing the abstraction layer to administrate and deploy regardless of any physical location. This has been especially beneficial with the extensibility required for AI and IoT processes at edge locations. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia4.giphy.com%2Fmedia%2FkgNjfxvXN54IrJOhwi%2Fgiphy.gif%3Fcid%3Decf05e477mvtw8z8x8avq0u6wfh3ueipanudv9axjqq3m72v%26rid%3Dgiphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia4.giphy.com%2Fmedia%2FkgNjfxvXN54IrJOhwi%2Fgiphy.gif%3Fcid%3Decf05e477mvtw8z8x8avq0u6wfh3ueipanudv9axjqq3m72v%26rid%3Dgiphy.gif" alt="billowy clouds traveling across the page"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;sup&gt;Credit: &lt;a href="https://giphy.com/stickers/sky-clouds-cloud-kgNjfxvXN54IrJOhwi" rel="noopener noreferrer"&gt;Dinaaaaaah&lt;/a&gt;&lt;/sup&gt;&lt;/p&gt;

&lt;p&gt;Distributed cloud is the next step coming out of public, private and hybrid cloud computing. With hybrid cloud, the cloud provider managed the public cloud and the customer managed their private cloud environment. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FCIQrc9P.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FCIQrc9P.png" alt="The phrase distributed cloud refers to public cloud services dispersed across various geographic locations that are chosen to meet application requirements, but the operations and governance of those services are still centrally controlled by a single public cloud provider.-Gartner"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;With distributed cloud, the customer uses the control plane to have visibility across locations that they administer and extend cloud services to as a single, distributed cloud. The cloud provider manages the underlying infrastructure, security, updates and operations. &lt;/p&gt;

&lt;h3&gt;
  
  
  Why is this beneficial?
&lt;/h3&gt;

&lt;p&gt;Traditional cloud computing offered a route for businesses to not have to build up their own infrastructure. Customers can use the cloud vendors such as AWS, Oracle, IBM Cloud, GCP and others who offer "pay for what you use" metered access to compute, networking, DBs, storage, microservices and more to businesses.&lt;/p&gt;

&lt;p&gt;&lt;em&gt;But&lt;/em&gt; there have been some problems with that. &lt;/p&gt;

&lt;p&gt;Sometimes the data center being utilized is not close enough in its physical location for the network performance that is required. Data packets must travel physical distances to transmit. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia0.giphy.com%2Fmedia%2FQLiW1gLoCz8wo%2Fgiphy.gif%3Fcid%3Decf05e470to1c9dpo1dqtf18g3ayikxru9ks9zagv8syh4hs%26rid%3Dgiphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia0.giphy.com%2Fmedia%2FQLiW1gLoCz8wo%2Fgiphy.gif%3Fcid%3Decf05e470to1c9dpo1dqtf18g3ayikxru9ks9zagv8syh4hs%26rid%3Dgiphy.gif" alt="holographic men running together in a line like shimmering weirdos as a personification of data packets in transit"&gt;&lt;/a&gt;&lt;br&gt;
&lt;sup&gt;Credit: &lt;a href="https://giphy.com/stickers/vincemckelvie-transparent-trippy-running-QLiW1gLoCz8wo" rel="noopener noreferrer"&gt;Vince Mckelvie&lt;/a&gt;&lt;/sup&gt;&lt;/p&gt;

&lt;p&gt;The greater the distance makes for the more time we must wait for those packets to transmit. So how do we shorten that distance for those data packets?&lt;/p&gt;

&lt;p&gt;We consider how we approach cloud computing. &lt;/p&gt;

&lt;p&gt;In the distributed model with public cloud infrastructure extended across varied physical locations, this lowers latency for better response time with workloads and increased throughput due to lower overall traffic. &lt;/p&gt;

&lt;p&gt;The control plane of the distributed cloud model helps to centralize the management of multiple cloud platforms to increase the control businesses have over their IT environments and allows for better organizational efficiency. &lt;/p&gt;

&lt;p&gt;Due to the COVID-19 pandemic, a lot of businesses have been looking to improve their digital presence, make more cost-effective IT decisions and unify their cloud strategy on the whole. The action steps to address those areas won't be stopping anytime soon post-pandemic.&lt;/p&gt;

&lt;p&gt;It's going to be pretty exciting to see how companies evolve and adopt a more distributed cloud computing model given the advantages that multiple clouds and edge computing provides.&lt;/p&gt;

&lt;p&gt;Thanks for reading my intro into distributed cloud! 😊&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia4.giphy.com%2Fmedia%2FJfcb1m7szdya4%2Fgiphy.gif%3Fcid%3Decf05e47vlbdztsxichlsvrwzqgkjld0nxxgo2l7hplpm2fs%26rid%3Dgiphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia4.giphy.com%2Fmedia%2FJfcb1m7szdya4%2Fgiphy.gif%3Fcid%3Decf05e47vlbdztsxichlsvrwzqgkjld0nxxgo2l7hplpm2fs%26rid%3Dgiphy.gif"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;sup&gt;Credit: &lt;a href="https://giphy.com/stickers/venus-Jfcb1m7szdya4" rel="noopener noreferrer"&gt;GIPHY&lt;/a&gt;&lt;/sup&gt;&lt;/p&gt;

</description>
      <category>kubernetes</category>
      <category>devops</category>
      <category>beginners</category>
    </item>
    <item>
      <title>37 Halloween Frontends🦇</title>
      <dc:creator>Julia Flash</dc:creator>
      <pubDate>Tue, 20 Oct 2020 18:06:16 +0000</pubDate>
      <link>https://dev.to/juliathepm/37-halloween-frontends-118i</link>
      <guid>https://dev.to/juliathepm/37-halloween-frontends-118i</guid>
      <description>&lt;p&gt;🎃 Allow for some load time 🎃 &lt;/p&gt;

&lt;p&gt;What's not to love with Halloween?&lt;br&gt;
It is the candy corn of my sunken eye sockets! &lt;/p&gt;

&lt;p&gt;So this October, I set out to find the spookiest designs.&lt;/p&gt;

&lt;p&gt;&lt;em&gt;Note: All works link to the creators for attribution and alternative text provided. Also if anyone knows of any Ghost Buster or Beetlejuice design themes, please share. I'm literally dying to see this...&lt;/em&gt; &lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/terabaud/embed/MWeYvPv?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dribbble.com/shots/13406697-Hulu-movie-genre-render-horror" rel="noopener noreferrer"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.dribbble.com%2Fusers%2F3964490%2Fscreenshots%2F13406697%2Fmedia%2F84780f24a917d27dfbb9f716fffc6c97.jpg" alt="halloween orange pumpkin rabbit mutation floating mid-air for Hulu design"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/issey/embed/qazVwX?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dribbble.com/shots/14398345-Halloween-Party" rel="noopener noreferrer"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.dribbble.com%2Fusers%2F4666603%2Fscreenshots%2F14398345%2Fmedia%2F8937a334f873725a8e17292e5f941b42.gif" alt="image of super creepy pixel box dotted images of super creepy bad guys from movies in bright neon colors!"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dribbble.com/shots/14201381-Antique-Halloween-Toys" rel="noopener noreferrer"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.dribbble.com%2Fusers%2F3774189%2Fscreenshots%2F14201381%2Fmedia%2F0d2a2b16903829a46b7ce8a26f7932bc.jpg" alt="image of vintage retro design of spooky skeletons and pumpkin art deco collage"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://codemyui.com/horror-movie-like-glitch-effect/" rel="noopener noreferrer"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcodemyui.com%2Fwp-content%2Fuploads%2F2017%2F08%2Fglitch-effect.gif" alt="image of girl glitching like a tv glitch with pigtails and platinum hair and blood on lip"&gt;&lt;/a&gt; &lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/hammercait/embed/RwaVyEj?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/gcyrillo/embed/RMzPjo?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dribbble.com/shots/14389372-Ghost-Agency-Free-Halloween-Kit-Figma-Community" rel="noopener noreferrer"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.dribbble.com%2Fusers%2F787324%2Fscreenshots%2F14389372%2Fmedia%2Fdb7ce8fd0a10271fdd8d57ccf415db5d.png" alt="candy skull frontend interface"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/eleana-tyradelli/embed/JjKoPqG?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/Lima_Hammoud_/embed/RwwjJyL?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/takaneichinose/embed/qzQMZy?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dribbble.com/shots/14302574-BOO" rel="noopener noreferrer"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.dribbble.com%2Fusers%2F3923578%2Fscreenshots%2F14302574%2Fmedia%2Fc0d79f0b1faf9893286ef1e2a363c749.jpg" alt="image of super kawaii smooth illustration of a pink teddy bear with candies in bright pastel colors!"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/ya_lops/embed/GvobzX?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;&lt;iframe width="710" height="399" src="https://www.youtube.com/embed/TBXjWsR7XDA"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dribbble.com/shots/7824372-Camp-Redwood-American-Horror-Story-84" rel="noopener noreferrer"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.dribbble.com%2Fusers%2F1497352%2Fscreenshots%2F7824372%2Fmedia%2F4326eb90c062fff8e4dba8808dc28364.jpg" alt="image from tv show stylized in 80s horror theme, campy! Bright neons with a woman and a knife on the head"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/ablissfullemon/embed/zJepap?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/vuild/embed/BvWLvB?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dribbble.com/shots/7374897-Horror-UI" rel="noopener noreferrer"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.dribbble.com%2Fusers%2F97158%2Fscreenshots%2F7374897%2Fmedia%2F28eee757aa67bbcd099ce89c583fcab3.gif" alt="ihaunting movie film imagery of Carrie, Conjuring, darker style, black background"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/ge1doot/embed/xrBryP?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/slyka85/embed/gQMzdJ?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dribbble.com/shots/5465663-Spooky-Island" rel="noopener noreferrer"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.dribbble.com%2Fusers%2F2090940%2Fscreenshots%2F5465663%2Fhalloween_pascal_4.gif" alt="Interesting light design landing page where an animation of a cornucopia of spooky objects and shapes pop up in tiers on the screen with a ghost its all lighter colors which makes it pretty unique looking for being so spooky"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dribbble.com/shots/14415829-Spooky-dashboard" rel="noopener noreferrer"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.dribbble.com%2Fusers%2F1788428%2Fscreenshots%2F14415829%2Fmedia%2F6e701868ff2f787906591f91b7ded813.png" alt="image of spooky graphical dashboard in purple and orange"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dribbble.com/shots/9306190-Halloween-landing-page" rel="noopener noreferrer"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.dribbble.com%2Fusers%2F2104999%2Fscreenshots%2F9306190%2Fmedia%2Fcb9a86d43985589d767f98e8ba2684c8.png" alt="slimey pumpkin frontend interface examples"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dribbble.com/shots/8003797-tError404" rel="noopener noreferrer"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.dribbble.com%2Fusers%2F136820%2Fscreenshots%2F8003797%2Fmedia%2F76c6fc93415324bbd9bc8719f048260f.png" alt="Creepy kid face landing page for 404 errors in blue and orange with the middle of his face split open and a white skull showing graphically not realistically but very spooky"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dribbble.com/shots/7901786-Haunted-House-Dribbble-Weekly-Warm-Up" rel="noopener noreferrer"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.dribbble.com%2Fusers%2F269899%2Fscreenshots%2F7901786%2Fmedia%2Fd3e1631d457a7f0d6b3e8b653b7ec466.png" alt="genuine looking haunted house in a 3D view very smooth surfaces and with the roof caved in like ghosts got into it, with a spooky vibe of fog and dark lighting!"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/Shreyansdongare/embed/jOrrNyN?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dribbble.com/shots/8335194-Halloween-Landing-Page" rel="noopener noreferrer"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.dribbble.com%2Fusers%2F1632586%2Fscreenshots%2F8335194%2Fmedia%2F5fb121232dc072495089f233900a4d8e.jpg" alt="happy halloween pumpkin modal card in orange with skull pattern behind modal"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/isuttell/embed/raxRaJ?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/colinmyers1/embed/oNLbGxd?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/3Shan3/embed/yLOwBYM?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dribbble.com/shots/14371464-Haunted-House" rel="noopener noreferrer"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.dribbble.com%2Fusers%2F15687%2Fscreenshots%2F14371464%2Fmedia%2F699436f595b1f63bf6dbac2ed71434b2.png" alt="happy halloween haunted 3D house with birds eye view and green lighting the windows eerily"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/supah/embed/yRYveX?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;&lt;iframe height="600" src="https://codepen.io/jkantner/embed/ErQNQW?height=600&amp;amp;default-tab=result&amp;amp;embed-version=2"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;p&gt;&lt;a href="https://dribbble.com/shots/5470774-Knock-Knock-Trick-or-Treat" rel="noopener noreferrer"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fcdn.dribbble.com%2Fusers%2F2323842%2Fscreenshots%2F5470774%2Fdribbble_halloween_kikis_6.gif" alt="cartoonish encounter of trick or treaters on a dark red night going to a super duper haunted house at night and encountering a nefarious creature of the night with the frontend text of Trick or Treat"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Hope you enjoyed the horrorful compilation of super terror!&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Ghoul's Note:&lt;/strong&gt; My name is Julia Nash, I am an Offering Manager for the Center of Open Source Data &amp;amp; Artificial Intelligence Technologies, which may or may not specialize in Open Source Paranormal Data &amp;amp; Artificial Zombie (and Goblin) Intelligence.&lt;/p&gt;

&lt;h3&gt;
  
  
  &lt;a href="https://www.ibm.com/opensource/centers/codait/projects/" rel="noopener noreferrer"&gt;&lt;strong&gt;&lt;em&gt;CHECK US OUT, IF YOU DARE...&lt;/em&gt;&lt;/strong&gt;&lt;/a&gt; 🧟‍♀️
&lt;/h3&gt;

</description>
      <category>halloween</category>
      <category>webdev</category>
      <category>css</category>
      <category>html</category>
    </item>
    <item>
      <title>Newly Released Datasets for ML/DL 💻</title>
      <dc:creator>Julia Flash</dc:creator>
      <pubDate>Wed, 14 Oct 2020 20:19:50 +0000</pubDate>
      <link>https://dev.to/ibmdeveloper/newly-released-datasets-from-r-d-for-ml-dl-51d7</link>
      <guid>https://dev.to/ibmdeveloper/newly-released-datasets-from-r-d-for-ml-dl-51d7</guid>
      <description>&lt;p&gt;&lt;em&gt;Previously published on my &lt;a href="https://lioz.io/blogs/newly-released-datasets-for-mldl" rel="noopener noreferrer"&gt;personal blog&lt;/a&gt;&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia4.giphy.com%2Fmedia%2FMBCodZbEhb2jSNUZNd%2Fgiphy.gif%3Fcid%3Decf05e47gzlpr2ygguzcpmw720ky3gx5csh14sbu6qf5b47o%26rid%3Dgiphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia4.giphy.com%2Fmedia%2FMBCodZbEhb2jSNUZNd%2Fgiphy.gif%3Fcid%3Decf05e47gzlpr2ygguzcpmw720ky3gx5csh14sbu6qf5b47o%26rid%3Dgiphy.gif" alt="image"&gt;&lt;/a&gt;&lt;br&gt;
&lt;sup&gt;Credit: &lt;a href="https://giphy.com/marketscale" rel="noopener noreferrer"&gt;Marketscale&lt;/a&gt;&lt;/sup&gt;&lt;/p&gt;

&lt;p&gt;Everyone knows about the datasets from &lt;a href="https://www.kaggle.com/" rel="noopener noreferrer"&gt;Kaggle&lt;/a&gt; and other sources like &lt;a href="https://archive.ics.uci.edu/ml/datasets.php" rel="noopener noreferrer"&gt;UCI&lt;/a&gt;, but there are treasure troves of data out there at your fingertips right now that you might not know of!&lt;/p&gt;

&lt;p&gt;One that you likely are not familiar with is the &lt;a href="https://ibm.biz/BdqwL8" rel="noopener noreferrer"&gt;Data Asset Exchange&lt;/a&gt; which is a repo of open sourced datasets recently publicized from enterprise research teams. There are 30+ datasets with a ton released just this year!&lt;/p&gt;

&lt;p&gt;The folks behind this effort are from the &lt;a href="//ibm.biz/BdqwL9"&gt;Center for Open-Source Data &amp;amp; AI Technologies&lt;/a&gt; (CODAIT) organization, a group of data scientists and open source developers dedicated to make open source AI easier to use. 🤗 &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmiro.medium.com%2Fmax%2F2000%2F1%2ACxVOBeicZkfqxa4WCSAk0Q.jpeg" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmiro.medium.com%2Fmax%2F2000%2F1%2ACxVOBeicZkfqxa4WCSAk0Q.jpeg" alt="codait max llama"&gt;&lt;/a&gt;&lt;br&gt;
&lt;sup&gt;An astounding llama depicted in the 4 styles available from the &lt;a href="https://medium.com/codait/art-ai-the-logic-behind-deep-learning-style-transfer-1f59f51441d1" rel="noopener noreferrer"&gt;‘Fast Neural Style Transfer’ model&lt;/a&gt; by CODAIT. &lt;br&gt;
Credit: &lt;a href="https://medium.com/codait/art-ai-the-logic-behind-deep-learning-style-transfer-1f59f51441d1" rel="noopener noreferrer"&gt;Nick Kasten&lt;/a&gt;&lt;/sup&gt;&lt;/p&gt;
&lt;h2&gt;
  
  
  Where are the datasets?
&lt;/h2&gt;

&lt;p&gt;You can find all the open source datasets &lt;a href="https://ibm.biz/BdqwL8" rel="noopener noreferrer"&gt;here.&lt;/a&gt; &lt;/p&gt;
&lt;h2&gt;
  
  
  How do I download them?
&lt;/h2&gt;

&lt;p&gt;Go to the link above and click on a dataset. &lt;br&gt;
Then when you are on the landing page, click &lt;code&gt;Get this dataset&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;That's all there is to it!&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FHmmxFZD.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FHmmxFZD.png" alt="image"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Keep reading if you want to preview your data before downloading it though! Its always smart to see what you are downloading first.&lt;/p&gt;
&lt;h2&gt;
  
  
  What are the data formats?
&lt;/h2&gt;

&lt;p&gt;They come in CSV, JSON, WAV, JPG, PNG, IOB, HDF5 and others depending on what the data is collected for. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia2.giphy.com%2Fmedia%2FP6vaRcD14JUzK%2Fgiphy.gif%3Fcid%3Decf05e471a2ce854d99d0ed5eb1f996e7c5643a7c1213dcf%26rid%3Dgiphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia2.giphy.com%2Fmedia%2FP6vaRcD14JUzK%2Fgiphy.gif%3Fcid%3Decf05e471a2ce854d99d0ed5eb1f996e7c5643a7c1213dcf%26rid%3Dgiphy.gif" alt="image"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;sup&gt;Credit: &lt;a href="https://giphy.com/vincemckelvie/" rel="noopener noreferrer"&gt;Vince McKelvie&lt;/a&gt;&lt;/sup&gt;&lt;/p&gt;
&lt;h2&gt;
  
  
  Can I look at the data before downloading it?
&lt;/h2&gt;

&lt;p&gt;Of course! There are data previews for all the datasets here where you can explore it before downloading it. &lt;/p&gt;

&lt;p&gt;Lets focus in on one dataset as an example to check this out!&lt;/p&gt;
&lt;h1&gt;
  
  
  Get Started with free DAX Datasets
&lt;/h1&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia2.giphy.com%2Fmedia%2FWN7PRQNfm31NhBxr3Z%2Fgiphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia2.giphy.com%2Fmedia%2FWN7PRQNfm31NhBxr3Z%2Fgiphy.gif" alt="image"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Go to the &lt;a href="https://ibm.biz/BdqwL8" rel="noopener noreferrer"&gt;datasets&lt;/a&gt;, then click on a dataset that interests you. That will take you to a landing page for particular dataset, like this dataset that I am going to walk through: "IBM Debater® Wikipedia Oriented Relatedness".&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2Fh7dNrhg.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2Fh7dNrhg.png" alt="image"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;See the blue rectangle in the image that highlights the text &lt;code&gt;Preview the data &amp;amp; notebooks&lt;/code&gt;? &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2F8PwxDuv.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2F8PwxDuv.png" alt="image"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Click on that button, which will take you to a page like this for the dataset: &lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FE4wh5pD.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FE4wh5pD.png" alt="image"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Now you can then look through each tab to check it out!&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FhqiR9Di.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FhqiR9Di.png" alt="image"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;I'll step through each of these 3 tabs here now so you can understand why they are provided for you.&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia2.giphy.com%2Fmedia%2FiiPPrOvkCSEogaJW3p%2Fgiphy.gif%3Fcid%3Decf05e47aee98a1152d11242b1b6a92c8fdb209581c5bb7d%26rid%3Dgiphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia2.giphy.com%2Fmedia%2FiiPPrOvkCSEogaJW3p%2Fgiphy.gif%3Fcid%3Decf05e47aee98a1152d11242b1b6a92c8fdb209581c5bb7d%26rid%3Dgiphy.gif" alt="image"&gt;&lt;/a&gt;&lt;br&gt;
&lt;sup&gt;Credit: &lt;a href="https://giphy.com/quasicrystals" rel="noopener noreferrer"&gt;Quasi Crystals&lt;/a&gt;&lt;/sup&gt;&lt;br&gt;
&lt;/p&gt;

&lt;h2&gt;
  
  
  Dataset Metadata
&lt;/h2&gt;

&lt;p&gt;The &lt;strong&gt;Dataset Metadata&lt;/strong&gt; section shows you what the dataset is used for (Domain), the authors and where it came from, as well as the business case on how you could use this dataset.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2F1EXXAED.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2F1EXXAED.png" alt="image"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;With the IBM Debater® Wikipedia Oriented Relatedness dataset, the business case is:&lt;br&gt;
&lt;/p&gt;

&lt;p&gt;&lt;code&gt;Automated Customer Service: Train a chatbot to label and compare user query's concept type with list of available concepts the chatbot is capable of discussing.&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;h2&gt;
  
  
  Dataset Preview
&lt;/h2&gt;

&lt;p&gt;In the &lt;strong&gt;Dataset Preview&lt;/strong&gt; tab, you actually see the dataset values as they are, be it images, POS (Parts of Speech), concept origins and other facets of the data itself. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FIHGTi13.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FIHGTi13.png" alt="image"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Dataset Glossary
&lt;/h2&gt;

&lt;p&gt;Last but not least, the &lt;strong&gt;Dataset Glossary&lt;/strong&gt; tab! &lt;br&gt;
This is for if you have no idea what certain words mean within the dataset, the glossary helps you understand terms more thoroughly. I think its cool because I tend to be one of those people. 🙃 &lt;br&gt;
For example, asking someone what "POS" was while doing ngram analysis.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FJuWaFuH.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FJuWaFuH.png" alt="image"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Are there examples on how to use the data?
&lt;/h2&gt;

&lt;p&gt;That was my question! Yes, I did find that there are example Jupyter notebooks provided for each dataset which shows an analysis using Python kernels. &lt;/p&gt;

&lt;p&gt;Go back to the main page with all the datasets &lt;a href="https://ibm.biz/BdqwL8" rel="noopener noreferrer"&gt;here.&lt;/a&gt; &lt;/p&gt;

&lt;p&gt;Then click on a dataset, which will lead it to landing page and go through the process of clicking on the &lt;code&gt;Preview the data &amp;amp; notebooks&lt;/code&gt; button in the top-right of the page.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2F8PwxDuv.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2F8PwxDuv.png" alt="image"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Then you will see in the navigation bar of the window these buttons:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2Faz8fOSa.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2Faz8fOSa.png" alt="image"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Click on &lt;code&gt;Preview Notebook&lt;/code&gt;. &lt;/p&gt;

&lt;p&gt;This will lead you straight to a notebook which shows how to start with or use the dataset in full!&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FssvpTFo.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FssvpTFo.png" alt="image"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Pretty cool, huh?&lt;/p&gt;

&lt;p&gt;Thank you for going through this short tutorial on what, where and how you can get started with Data Asset Exchange datasets via the &lt;a href="//ibm.biz/BdqwL9"&gt;CODAIT.org&lt;/a&gt; team! &lt;/p&gt;

&lt;h2&gt;
  
  
  3 Favorite DAX Datasets
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://ibm.biz/BdqwLV" rel="noopener noreferrer"&gt;Forum Classify Dataset&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;em&gt;"The dataset consists of 100 discussion threads crawled from Ubuntu Forums discussions. Each message in each individual thread is assigned a dialog label out of following eight classes: question, repeat question, clarification, further details, solution, positive feedback, negative feedback, junk."&lt;/em&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://ibm.biz/BdqwLJ" rel="noopener noreferrer"&gt;Video-Text Compliance&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;em&gt;"VTC contains 7920 samples, each consisting of a video-text instruction pair and a compliance/non-compliance label. The dataset has over 1.2 million frames. We take a unique approach in data collection so that the dataset can be automatically augmented from a set of core videos. To answer growing concerns on data privacy, we carefully followed privacy preserving safe-guards in the generation of VTC dataset."&lt;/em&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://ibm.biz/BdqwLA" rel="noopener noreferrer"&gt;WikiText-103&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;em&gt;"The WikiText-103 dataset is a collection of over 100 million tokens extracted from the set of verified ‘Good’ and ‘Featured’ articles on Wikipedia."&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Hope you enjoyed this article, comment if you have any questions! 🐬&lt;/p&gt;

&lt;p&gt;&lt;a href="https://i.giphy.com/media/Le2scll3cLjgI/giphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://i.giphy.com/media/Le2scll3cLjgI/giphy.gif" alt="image"&gt;&lt;/a&gt;&lt;br&gt;
&lt;sup&gt;Credit: &lt;a href="//rebloggy.com/post/gif-transparent-lightbulb/78406294832"&gt;Rebloggy&lt;/a&gt;&lt;/sup&gt;&lt;/p&gt;

</description>
      <category>datascience</category>
      <category>showdev</category>
      <category>opensource</category>
      <category>python</category>
    </item>
    <item>
      <title>Next.js on IBM Cloud</title>
      <dc:creator>Julia Flash</dc:creator>
      <pubDate>Sat, 07 Dec 2019 01:02:01 +0000</pubDate>
      <link>https://dev.to/ibmdeveloper/next-js-on-ibm-cloud-3bga</link>
      <guid>https://dev.to/ibmdeveloper/next-js-on-ibm-cloud-3bga</guid>
      <description>&lt;h3&gt;
  
  
  Next.js w/ Custom Express Server example for IBM Cloud
&lt;/h3&gt;

&lt;p&gt;&lt;em&gt;A version of &lt;a href="https://github.com/zeit/next.js/tree/master/examples/custom-server-express" rel="noopener noreferrer"&gt;Next's example/custom-server-express&lt;/a&gt; revised to &lt;a href="https://github.com/nimicent/ibmcloud-nextjs-custom-server-express" rel="noopener noreferrer"&gt;deploy to IBM Cloud&lt;/a&gt;.&lt;/em&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  Why use Next.js React Framework
&lt;/h3&gt;

&lt;p&gt;Always is my advice to go to the &lt;a href="https://github.com/zeit/" rel="noopener noreferrer"&gt;people&lt;/a&gt; and look at the docs where the developers state the reasons they made it. Then look to read opinions, gossip magazines or additional articles outside of the developers. That is just my structure and person though.&lt;/p&gt;

&lt;p&gt;The example app isn't anything special here. Shows routing. It will get you up and going on IBM Cloud in a few minutes using Next.&lt;/p&gt;

&lt;h3&gt;
  
  
  Why I did this
&lt;/h3&gt;

&lt;p&gt;I was freaking out. I tend to use new stuff more than hang on anything I have used time and time again. My deployment failed a few times on IBM Cloud given the Zeit custom-server-using-express main example.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://github.com/mars/heroku-nextjs-custom-server-express" rel="noopener noreferrer"&gt;Mars and his Heroku implementation&lt;/a&gt; saved me thirty minutes at the very least of trying to get it deployed. So I decided to share this riffing for IBM Cloud platform to save other people some time too possibly.&lt;/p&gt;

&lt;h4&gt;
  
  
  How to set it up
&lt;/h4&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;First you need an account on &lt;a href="https://cloud.ibm.com/" rel="noopener noreferrer"&gt;IBM Cloud&lt;/a&gt;&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Install &lt;a href="https://github.com/IBM-Cloud/ibm-cloud-cli-release" rel="noopener noreferrer"&gt;IBM Cloud CLI&lt;/a&gt; and restart terminal, type &lt;code&gt;ibmcloud&lt;/code&gt; to check&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;To minimize number of specifications per deploy to IBM Cloud you can use an application manifest like this one &lt;a href="https://github.com/nimicent/ibmcloud-nextjs-custom-server-express/blob/master/manifest.yml" rel="noopener noreferrer"&gt;manifest.yml&lt;/a&gt; &lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Change the name and host to what you want them to be.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FYAzCYHv.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FYAzCYHv.png" alt="the manifest.yml"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Go into root directory, make sure you have permissions for everything.&lt;br&gt;
Now this next image - these are my actions I did for pushing up this application.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FVfokmYM.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FVfokmYM.png" alt="using ibmcloud cli to push up app"&gt;&lt;/a&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;npm i &lt;span class="nt"&gt;--save&lt;/span&gt;
ibmcloud login &lt;span class="nt"&gt;--sso&lt;/span&gt;
ibmcloud target &lt;span class="nt"&gt;--cf&lt;/span&gt; 
ibmcloud app push
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Watch deployment logs.&lt;/p&gt;

&lt;p&gt;You should see ... &lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FLUCWCwO.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FLUCWCwO.png" alt="console shows that app has started on IBM Cloud"&gt;&lt;/a&gt;&lt;br&gt;
And that is it. You have Next.js example app on IBM Cloud. 🦑&lt;/p&gt;

&lt;h5&gt;
  
  
  &lt;a href="https://testingnextjs.mybluemix.net/" rel="noopener noreferrer"&gt;https://testingnextjs.mybluemix.net/&lt;/a&gt;
&lt;/h5&gt;

&lt;p&gt;If you are doing more than this example demo and it fails&lt;br&gt;
  &lt;code&gt;ibmcloud cf logs [YOUR_APPSNAME] --recent&lt;/code&gt; &lt;br&gt;
And watch it. I have been mostly able to troubleshoot from those logs and use &lt;a href="https://docs.cloudfoundry.org/devguide/deploy-apps/deploy-app.html" rel="noopener noreferrer"&gt;cf&lt;/a&gt; docs.&lt;/p&gt;

&lt;h6&gt;
  
  
  Note: I altered the &lt;code&gt;production&lt;/code&gt; to &lt;code&gt;dev&lt;/code&gt; in the start script of package.json bc I hadn't installed dotenv and was first figuring out deployment of a live instance solely using next.js before actual implementation.
&lt;/h6&gt;

&lt;h2&gt;
  
  
  Zeit - The idea behind the example app
&lt;/h2&gt;

&lt;p&gt;Most of the times the default Next server will be enough but sometimes you want to run your own server to customize routes or other kind of the app behavior. Next provides a &lt;a href="https://github.com/zeit/next.js#custom-server-and-routing" rel="noopener noreferrer"&gt;Custom server and routing&lt;/a&gt; so you can customize as much as you want.&lt;/p&gt;

&lt;p&gt;Because the Next.js server is just a node.js module you can combine it with any other part of the node.js ecosystem. in this case we are using express to build a custom router on top of Next.&lt;/p&gt;

&lt;p&gt;The example shows a server that serves the component living in &lt;code&gt;pages/a.js&lt;/code&gt; when the route &lt;code&gt;/b&lt;/code&gt; is requested and &lt;code&gt;pages/b.js&lt;/code&gt; when the route &lt;code&gt;/a&lt;/code&gt; is accessed. This is obviously a non-standard routing strategy. You can see how this custom routing is being made inside &lt;code&gt;server.js&lt;/code&gt;.&lt;/p&gt;

</description>
      <category>nextjs</category>
      <category>node</category>
      <category>express</category>
      <category>react</category>
    </item>
    <item>
      <title>Possibly Odd Approach for Quick Authentication - User Registry API and Passport</title>
      <dc:creator>Julia Flash</dc:creator>
      <pubDate>Wed, 15 May 2019 00:46:56 +0000</pubDate>
      <link>https://dev.to/ibmdeveloper/possibly-odd-approach-for-quick-authentication-user-registry-api-passport-js-tutorial-3k02</link>
      <guid>https://dev.to/ibmdeveloper/possibly-odd-approach-for-quick-authentication-user-registry-api-passport-js-tutorial-3k02</guid>
      <description>&lt;p&gt;🌺 So I woke up last night thinking "This might be a bit weird." 🌺&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia2.giphy.com%2Fmedia%2Fe7f0kJekLyFFe%2Fgiphy.gif%3Fcid%3D790b76115cdae8865535536973d9856f%26rid%3Dgiphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia2.giphy.com%2Fmedia%2Fe7f0kJekLyFFe%2Fgiphy.gif%3Fcid%3D790b76115cdae8865535536973d9856f%26rid%3Dgiphy.gif" alt="I love mermaids"&gt;&lt;/a&gt;&lt;br&gt;
&lt;/p&gt;

&lt;br&gt;
&lt;strong&gt;Article&lt;/strong&gt;

&lt;p&gt;I want to walk through what I did and why. So this article will go over integrating my existing app with sample code generated by creating the API on the platform.&lt;/p&gt;

&lt;p&gt;My Cloud Foundry application is Node with Express framework routing, .ejs view engine. This API called &lt;code&gt;App ID&lt;/code&gt; has a user registry that comes with sample code | SDKs for Swift, Node, Java and Android. The API has a free tier for up to 1000 users and 1000 events (an 'event' being like someone logging in).&lt;/p&gt;

&lt;p&gt;Best way to see all features of the app is the &lt;a href="https://tinyurl.com/y34yy59z" rel="noopener noreferrer"&gt;API Docs&lt;/a&gt;. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://i.giphy.com/media/lPRJm0Y6QWnDUaY6ba/giphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://i.giphy.com/media/lPRJm0Y6QWnDUaY6ba/giphy.gif" alt="api video"&gt;&lt;/a&gt;&lt;br&gt;
&lt;/p&gt;


&lt;p&gt;&lt;strong&gt;Friday Night&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;I was on my beanbag in my office using &lt;a href="https://tinyurl.com/kwehabu" rel="noopener noreferrer"&gt;Passport-Local Mongoose&lt;/a&gt; for a quick login by email and password for this application.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://i.giphy.com/media/kEX6BLa5F2VofquFQt/giphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://i.giphy.com/media/kEX6BLa5F2VofquFQt/giphy.gif" alt="colorful login"&gt;&lt;/a&gt; &lt;/p&gt;

&lt;p&gt;Do I really need to store user information in MongoDB? &lt;br&gt;
Nobody will need to sign-up for this application. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia2.giphy.com%2Fmedia%2F3ohhwF1sQvpS2XgPu0%2Fgiphy.gif%3Fcid%3D790b76115cdc2d9d6d4130554571380b%26rid%3Dgiphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia2.giphy.com%2Fmedia%2F3ohhwF1sQvpS2XgPu0%2Fgiphy.gif%3Fcid%3D790b76115cdc2d9d6d4130554571380b%26rid%3Dgiphy.gif" alt="jff"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Currently, I am giving out the link to the application for a small pool of people that it could help. The application serves one purpose and zero APIs are used in it. Nothing sensitive really. &lt;/p&gt;

&lt;p&gt;Since I was using Passport.js already, I faintly recalled that there was a service on IBM Cloud I might've seen that used Passport somehow - this API ended up being App ID. It has a &lt;a href="https://tinyurl.com/y2bxcvpo" rel="noopener noreferrer"&gt;Node SDK for mobile and web&lt;/a&gt;. &lt;/p&gt;

&lt;p&gt;I was looking into the App ID documentation, and took note of something that might be really helpful: The &lt;a href="https://tinyurl.com/y5g6yhk8" rel="noopener noreferrer"&gt;Cloud Directory&lt;/a&gt;. &lt;/p&gt;

&lt;p&gt;So, I decided to use this API to register my users for my application.&lt;br&gt;
And this move saved me a heck of a lot of time on Friday evening.&lt;/p&gt;

&lt;p&gt;Weird part is that I have to populate the passwords for users...&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Time Spent - My First Time Using This API&lt;/strong&gt; &lt;a href="https://i.giphy.com/media/dXG2oppbjzs6PgWSKZ/giphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://i.giphy.com/media/dXG2oppbjzs6PgWSKZ/giphy.gif" alt="doodle"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Let's get into it. Here are the steps. Shouldn't take much.&lt;/p&gt;




&lt;p&gt;📄 &lt;a href="https://tinyurl.com/y5ma4aj3" rel="noopener noreferrer"&gt;Register for IBM Cloud&lt;/a&gt;&lt;br&gt;
📧 Confirm Registration by email &lt;br&gt;
💻 Login to Account&lt;br&gt;
😄 Configure &lt;a href="https://tinyurl.com/y46m227u" rel="noopener noreferrer"&gt;IBM Cloud CLI&lt;/a&gt;&lt;br&gt;
🎸 &lt;a href="https://tinyurl.com/y2f7rtvq" rel="noopener noreferrer"&gt;Create App ID Service&lt;/a&gt;&lt;br&gt;
🎨 Download Sample Code &lt;br&gt;
🌊 Integrate to Existing App&lt;br&gt;
👽 Setup and Redirect from Login&lt;br&gt;
🎀 Add users in Cloud Directory&lt;br&gt;
👑 Deploy Application&lt;/p&gt;




&lt;p&gt;&lt;strong&gt;Register&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Does not require anything but name | email. No cards.&lt;/p&gt;




&lt;p&gt;&lt;strong&gt;Confirmation&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;I did this sign up process in writing this to make sure I go through everything, took less than five minutes to get the confirmation email per registering to the platform.&lt;/p&gt;


 &lt;br&gt;
&lt;strong&gt;Login&lt;/strong&gt;

&lt;p&gt;Login to your account.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia2.giphy.com%2Fmedia%2Fl378bM6SldIuqFJtK%2Fgiphy.gif%3Fcid%3D790b76115cdd80752e4f38744d5de6db%26rid%3Dgiphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia2.giphy.com%2Fmedia%2Fl378bM6SldIuqFJtK%2Fgiphy.gif%3Fcid%3D790b76115cdd80752e4f38744d5de6db%26rid%3Dgiphy.gif" alt="stars"&gt;&lt;/a&gt;&lt;/p&gt;



&lt;br&gt;
&lt;strong&gt;CLI&lt;/strong&gt;

&lt;p&gt;You will need this &lt;a href="https://tinyurl.com/y46m227u" rel="noopener noreferrer"&gt;command line interface for IBM Cloud&lt;/a&gt;. This is for when you build locally and then want to re-deploy the sample code with regards to this tutorial. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://i.giphy.com/media/YSHzjFJXGdMwiz1Llp/giphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://i.giphy.com/media/YSHzjFJXGdMwiz1Llp/giphy.gif" alt="cli"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Commands that you need to know (remember post-install to have a new terminal session to start using the CLI) =&amp;gt; &lt;/p&gt;

&lt;p&gt;&lt;code&gt;ibmcloud login&lt;/code&gt;&lt;br&gt;
&lt;code&gt;ibmcloud target --cf&lt;/code&gt;&lt;/p&gt;



&lt;br&gt;
&lt;strong&gt;API&lt;/strong&gt;

&lt;p&gt;Create the API for your own use. You can use my &lt;a href="https://tinyurl.com/y2f7rtvq" rel="noopener noreferrer"&gt;link&lt;/a&gt; or find App ID under the Security section of the Catalog. You can do this all by the &lt;a href="https://tinyurl.com/yx9s3naw" rel="noopener noreferrer"&gt;IBM Cloud CLI&lt;/a&gt;. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://i.giphy.com/media/fVWConMBT2Pjunb93l/giphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://i.giphy.com/media/fVWConMBT2Pjunb93l/giphy.gif" alt="catalog"&gt;&lt;/a&gt;&lt;/p&gt;




&lt;p&gt;&lt;strong&gt;Click&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Once you reach the landing page for the service, there is a little button labeled 'Create' in furthest right-hand corner. Click that to create an instance of App ID for your own use.&lt;/p&gt;



&lt;br&gt;
&lt;strong&gt;Sample Code&lt;/strong&gt;

&lt;p&gt;Download the sample code for Swift, Node, Java or Android. &lt;br&gt;
&lt;a href="https://i.giphy.com/media/QWXb7zdirSYT5w7oF3/giphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://i.giphy.com/media/QWXb7zdirSYT5w7oF3/giphy.gif" alt="sample code"&gt;&lt;/a&gt;&lt;br&gt;
&lt;/p&gt;

&lt;br&gt;
&lt;strong&gt;Integrate&lt;/strong&gt;

&lt;p&gt;You can use this service while hosting your application on other platforms. It does not have to be hosted on IBM Cloud. &lt;/p&gt;

&lt;p&gt;Remember that sample code? It is really useful here. &lt;br&gt;
&lt;a href="https://i.giphy.com/media/eJA5Yrl4OcehkwvVcw/giphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://i.giphy.com/media/eJA5Yrl4OcehkwvVcw/giphy.gif" alt="downloaded code"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;I opened the /protected.ejs in Sublime and placed the code of my existing application's home page here.&lt;/p&gt;

&lt;p&gt;Then I made sure all the paths to the files were correct so it renders properly.&lt;br&gt;
&lt;/p&gt;

&lt;br&gt;
&lt;strong&gt;Setup&lt;/strong&gt;

&lt;p&gt;For when you want to re-deploy this sample application to IBM Cloud with your integrations made, you will need to look at the alias connection for the sample code that is at the bottom of the &lt;code&gt;manifest.yml&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2F4lcPmV9.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2F4lcPmV9.png" alt="manifest"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;This alias creates a connection between your App ID service and the sample code being a Cloud Foundry application. So, the IBM Cloud CLI needs to be configured for you to do this. The documentation on this part is actually very good.&lt;/p&gt;

&lt;p&gt;BUT there is &lt;em&gt;one funky thing&lt;/em&gt; to deal with that will save you some time. &lt;/p&gt;

&lt;p&gt;If you look in your account's &lt;code&gt;Resource List&lt;/code&gt; in the side panel:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FDj4ziDf.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FDj4ziDf.png" alt="resource list"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Are there whitespaces in your service name? Upon re-deployment, having whitespace will mess things up. If your service name for App ID has whitespace, for example &lt;code&gt;App ID-4343&lt;/code&gt; then use the ellipsis on the right to &lt;code&gt;Rename&lt;/code&gt; it to &lt;code&gt;AppID-4343&lt;/code&gt; to correct this. &lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FdwjELhH.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FdwjELhH.png" alt="nospace"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Then go to your sample code locally and look at your manifest.yml file. Does the service name with the word &lt;code&gt;alias&lt;/code&gt; in it have any whitespace?&lt;/p&gt;

&lt;p&gt;Lets go take off that empty space that will only make for errors in our terminal, who has always been by our side! &lt;/p&gt;

&lt;p&gt;Then follow the commands &lt;a href="https://tinyurl.com/yy2gk59k" rel="noopener noreferrer"&gt;here&lt;/a&gt; and create that alias properly to bind to that service name. It should not spit out any errors now.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia0.giphy.com%2Fmedia%2Fl4pT3EOebQHolKkkU%2Fgiphy.gif%3Fcid%3D790b76115cdc291d4347744e5166463a%26rid%3Dgiphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia0.giphy.com%2Fmedia%2Fl4pT3EOebQHolKkkU%2Fgiphy.gif%3Fcid%3D790b76115cdc291d4347744e5166463a%26rid%3Dgiphy.gif" alt="yay"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;And one small note - this particular command in those instructions? &lt;/p&gt;

&lt;p&gt;&lt;code&gt;ibmcloud resource service-alias-create {ALIAS_NAME} --instance-name {SERVICE_INSTANCE_NAME}&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;You can take off those curly brackets when you make this command for those names.&lt;/p&gt;

&lt;p&gt;And if you mess up, you can delete the alias. To do this - you go into your IBM Cloud "Resource List" in your left-side navigation bar, find the instance of App ID with the word "alias" in the title of the service, click the ellipsis and select "Delete" in the drop-down.&lt;br&gt;
&lt;/p&gt;

&lt;br&gt;
&lt;strong&gt;Redirect&lt;/strong&gt;

&lt;p&gt;The manifest.yml is necessary for deploying the app with your modifications from the command line. You can read about its purpose in regards to the platform in the &lt;a href="https://tinyurl.com/ya7d3fbw" rel="noopener noreferrer"&gt;Cloud Foundry documentation&lt;/a&gt; if you would like to know more.&lt;/p&gt;

&lt;p&gt;Lets go back to the App ID service home page on IBM Cloud.&lt;/p&gt;

&lt;p&gt;We need to add the proper callback for your application.&lt;/p&gt;

&lt;p&gt;Click on &lt;code&gt;Manage Authentication&lt;/code&gt; in the service navigation bar.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2F4cy4hyR.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2F4cy4hyR.png" alt="Auth manage"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;And open the &lt;code&gt;Authentication Settings&lt;/code&gt; tab.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FgiIZAce.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FgiIZAce.png" alt="image for redirect"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Look at your application's name in the manifest.yml file. What is your domain name? &lt;/p&gt;

&lt;p&gt;Right now you probably have not routed this to being a custom domain, so let's use the &lt;code&gt;mybluemix.net&lt;/code&gt; domain and add &lt;code&gt;/ibm/bluemix/appid/callback&lt;/code&gt; to the end of that. &lt;/p&gt;

&lt;p&gt;You can add any other paths here too. In full, you are providing here the &lt;code&gt;nameofyourapp.mybluemix.net/ibm/bluemix/appid/callback&lt;/code&gt; for that kosher callback.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Cloud Directory&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Finally, now we can populate your Cloud Directory with users!&lt;/p&gt;

&lt;p&gt;Make sure that your Cloud Directory is toggled &lt;code&gt;On&lt;/code&gt; within the &lt;code&gt;Identity Providers&lt;/code&gt; tab of the &lt;code&gt;Manage Authentication&lt;/code&gt; management section.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FDCEA4EJ.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FDCEA4EJ.png" alt="turn on"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FMhou8XR.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2FMhou8XR.png" alt="user registry"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;And add your users within the &lt;code&gt;Users&lt;/code&gt; section!&lt;/p&gt;




&lt;p&gt;&lt;strong&gt;Live&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Once you are ready to have a live link by configuration across these above steps, you can go into the root directory locally for your sample code app. Type the command &lt;code&gt;ibmcloud app push&lt;/code&gt; to trigger the deployment of your application. &lt;/p&gt;

&lt;p&gt;This process will give you a link to the live application when the deployment process has completed.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2F5CwVima.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fi.imgur.com%2F5CwVima.png" alt="goodjob"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Try logging in with one of the emails/usernames to test it out.&lt;/p&gt;

&lt;p&gt;There are a ton of great features to this service. Remember, you don't have to link your credit card here to make the service. But it will stop functioning per the 1000 free events occurring. &lt;/p&gt;

&lt;p&gt;I think this threshold would be the first upper limit hit unless you can add multiple users in a batch by the API. This is due to my testing the login making for 6 events in itself. But for a demo | PoC or the secure login of an app with light amounts of web traffic, this is a possible temporary free solution.&lt;/p&gt;

&lt;p&gt;Hope you liked this tutorial. Thanks!&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Some Helpful Links&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://tinyurl.com/y663blec" rel="noopener noreferrer"&gt;App ID landing page&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://tinyurl.com/yyl4fr5x" rel="noopener noreferrer"&gt;App ID video overview&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://tinyurl.com/y5ph6a28" rel="noopener noreferrer"&gt;API reference&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://tinyurl.com/yy4zx22e" rel="noopener noreferrer"&gt;Securing Angular+Node.js Applications using App ID&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia0.giphy.com%2Fmedia%2Fao9DUiTKH60XS%2Fgiphy.gif%3Fcid%3D790b76115cdc2e3c6b677859458c010f%26rid%3Dgiphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fmedia0.giphy.com%2Fmedia%2Fao9DUiTKH60XS%2Fgiphy.gif%3Fcid%3D790b76115cdc2e3c6b677859458c010f%26rid%3Dgiphy.gif" alt="pixel computer ftw bc i love it"&gt;&lt;/a&gt;&lt;/p&gt;

</description>
      <category>node</category>
      <category>javascript</category>
      <category>authentication</category>
      <category>security</category>
    </item>
  </channel>
</rss>
