<?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: Simona Winnekes</title>
    <description>The latest articles on DEV Community by Simona Winnekes (@winnekes).</description>
    <link>https://dev.to/winnekes</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%2F616008%2F74d1598b-bdc9-4364-981a-b6bcd96e804a.jpg</url>
      <title>DEV Community: Simona Winnekes</title>
      <link>https://dev.to/winnekes</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/winnekes"/>
    <language>en</language>
    <item>
      <title>Say hello to sturmglas (a hackathon project)</title>
      <dc:creator>Simona Winnekes</dc:creator>
      <pubDate>Wed, 01 Sep 2021 07:50:59 +0000</pubDate>
      <link>https://dev.to/winnekes/say-hello-to-sturmglas-a-hackathon-project-3f43</link>
      <guid>https://dev.to/winnekes/say-hello-to-sturmglas-a-hackathon-project-3f43</guid>
      <description>&lt;h2&gt;
  
  
  Introducing sturmglas - don't weather your emotions alone.
&lt;/h2&gt;

&lt;p&gt;Hello everyone! With a few hours to spare, I am happy to share my contribution to the &lt;a href="https://townhall.hashnode.com/auth0-hackathon" rel="noopener noreferrer"&gt;Auth0/Hashnode&lt;/a&gt; hackathon!&lt;/p&gt;

&lt;p&gt;What a fun experience it has been in the last 25 days! I learned more about Next.js, IoT, and authentication/authorization.&lt;/p&gt;

&lt;h2&gt;
  
  
  tl;dr
&lt;/h2&gt;

&lt;p&gt;Here are the links!&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://sturmglas.com" rel="noopener noreferrer"&gt;sturmglas&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://github.com/winnekes/sturmglas" rel="noopener noreferrer"&gt;Sturmglas repository&lt;/a&gt; &lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;But keep reading to find out what these cuties are:&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%2FjDi0Qay.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%2Fi.imgur.com%2FjDi0Qay.gif" alt="Imgur"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Inspiration 🌟
&lt;/h2&gt;

&lt;p&gt;Before &lt;a href="https://winnekes.hashnode.dev/from-scrubs-to-slacks" rel="noopener noreferrer"&gt;switching careers&lt;/a&gt; I was a nurse and specialised in cardiology and psychiatry. &lt;/p&gt;

&lt;p&gt;Mental health is such an important part of our life and wellbeing, but often neglected. My nephew for example can never express his feelings without the help of his toys.&lt;/p&gt;

&lt;p&gt;And maybe you just don't want to talk about how you feel or why you feel a certain way but still want the people around you to know. &lt;/p&gt;

&lt;p&gt;Introducing &lt;a href="https://winnekes.hashnode.dev/from-scrubs-to-slacks" rel="noopener noreferrer"&gt;sturmglas&lt;/a&gt; and Companions.&lt;/p&gt;

&lt;h2&gt;
  
  
  Video demos 📼
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;Companion demo&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;%[&lt;a href="https://youtu.be/8u_i7pVv38M" rel="noopener noreferrer"&gt;https://youtu.be/8u_i7pVv38M&lt;/a&gt;]&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Desktop (app only, without companion)&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;%[&lt;a href="https://youtu.be/lWHwMlVTJ20" rel="noopener noreferrer"&gt;https://youtu.be/lWHwMlVTJ20&lt;/a&gt;]&lt;/p&gt;

&lt;p&gt;Here's a picture with all the Companions! Happy to share more about them. You can find the STL files (the 3d printer files) in the repo as well. &lt;br&gt;
The following companions exist, in emoji form: 🐰🦊​ 🐙🍀☁️&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%2FsH7Lk1o.jpg" 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%2FsH7Lk1o.jpg" alt="Imgur"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Features
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Add, edit, delete your mood!&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%2Fi.imgur.com%2FekTyBcA.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%2Fi.imgur.com%2FekTyBcA.gif" alt="Imgur"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Share your mood as downloadable png!&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%2Fi.imgur.com%2FUqt1oxk.jpg" 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%2FUqt1oxk.jpg" alt="Imgur"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;View insights/stats about your moods!&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%2Fi.imgur.com%2Fhzhvb8a.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%2Fi.imgur.com%2Fhzhvb8a.gif" alt="Imgur"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Tech stack 🖥️
&lt;/h2&gt;

&lt;p&gt;We have the PWA (installable web application) and the IoT companions.&lt;/p&gt;

&lt;p&gt;I always wanted to see how I can build a complete server on Next.js and figured out to use GraphQL instead of REST on the backend. type-graphql and TypeORM were a bit of a pain to setup, certain Babel configurations where necessary, but I managed in the end.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;For the PWA (100% TypeScript):&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Nextjs&lt;/li&gt;
&lt;li&gt;Auth0&lt;/li&gt;
&lt;li&gt;Chakra UI&lt;/li&gt;
&lt;li&gt;Chartjs&lt;/li&gt;
&lt;li&gt;Web Bluetooth API&lt;/li&gt;
&lt;li&gt;GraphQL (server and client)&lt;/li&gt;
&lt;li&gt;TypeORM&lt;/li&gt;
&lt;li&gt;PostgreSQL database (hosted on &lt;a href="https://supabase.io" rel="noopener noreferrer"&gt;supabase.io&lt;/a&gt;)&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;For the IoT companions&lt;/strong&gt;:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;TTGO T-Display&lt;/li&gt;
&lt;li&gt;Pizo Buzzer&lt;/li&gt;
&lt;li&gt;LiPo battery (3.7v battery)&lt;/li&gt;
&lt;li&gt;3d-printed case, designed using OpenSCAD and printed on an Ender 3 in different filaments.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Here I used C++ to setup the Bluetooth connection, the buzzer sounds (when connecting and disconnecting) and the way of rendering the cute faces. 😊 &lt;br&gt;
My boyfriend is a wizard and (patiently) taught me a lot about hardware, batteries, memoryd buffer.&lt;/p&gt;

&lt;h2&gt;
  
  
  What is the one thing I would change? 😢
&lt;/h2&gt;

&lt;p&gt;Looking back I believe I should have gone the native way.&lt;/p&gt;

&lt;p&gt;PWA are awesome and I believe they are the future! But they are far from a native app can deliver to the user. The Web Bluetooth API for example is still quite experimental and in early stages despite its age.&lt;/p&gt;

&lt;p&gt;I already see limitations - for example when I connect to a Companion my phone does not indicate that I am connected to a Bluetooth device. Further more I cannot be connected in the background - only while the web app is in the foreground can I interact with the Companion. &lt;/p&gt;

&lt;p&gt;We still can't automatically connect to a Bluetooth device after sucessful pairing - right now the user has to connect to their Companion every time they come back to the app. It is of course a security features so that malicious websites cannot hack into your devices.&lt;/p&gt;

&lt;p&gt;Say hello to refactoring!&lt;/p&gt;

&lt;h2&gt;
  
  
  What's coming next? ⌛
&lt;/h2&gt;

&lt;p&gt;As mentioned, I will most likely refactor the application to React Native after research Bluetooth more. I want to more use of Auth0's features, especially role-based access.&lt;/p&gt;

&lt;p&gt;Some of the features to come are:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;The Companion&lt;/strong&gt;

&lt;ul&gt;
&lt;li&gt;The Companion is nothing more than a mirror of your emotions at the moment. The idea is that of a Tamagotchi in the future; you take care of the mental health of your Companion 💪&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;

&lt;strong&gt;Habits&lt;/strong&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://sturmglas.com" rel="noopener noreferrer"&gt;sturmglas&lt;/a&gt; wants to help you build better habits and in turn improve your mental health and wellbeing. Say you want to stop smoking? Drink more water? &lt;a href="https://sturmglas.com" rel="noopener noreferrer"&gt;sturmglas&lt;/a&gt; and your companion will help you stay on track.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;

&lt;strong&gt;Mood prediction&lt;/strong&gt;

&lt;ul&gt;
&lt;li&gt;So far I'm only collecting data and displaying it back to the user. I want to notice trends, suggest targeted challenges/habits/meditation that might help you feel better&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;

&lt;strong&gt;Bonfires&lt;/strong&gt;

&lt;ul&gt;
&lt;li&gt;Start or join groups to discuss mental health, tips and tricks around those topics, share healthy habits and goals&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;

&lt;strong&gt;For children&lt;/strong&gt;

&lt;ul&gt;
&lt;li&gt;Teaching children how to deal with feelings (especially negative ones) is not easy. With the help of the Companion they can express their emotions in a safe way&lt;/li&gt;
&lt;li&gt;A dashboard for parents if users are underage&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;

&lt;h2&gt;
  
  
  "How do I get a Companion?" 🐰🦊​ 🐙🍀☁️
&lt;/h2&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%2FjDi0Qay.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%2Fi.imgur.com%2FjDi0Qay.gif" alt="Imgur"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;The little companions were completely manufactured by me. I listed the resources used, the STL files to print, and the code is available in the &lt;a href="https://github.com/winnekes/sturmglas/iot" rel="noopener noreferrer"&gt;repository&lt;/a&gt;. &lt;/p&gt;

&lt;p&gt;If you want you could build your very own!&lt;/p&gt;

&lt;p&gt;That being said, should this idea have traction and people are requesting a companion I'll do my best to get that production line started for an initial alpha stage of &lt;a href="https://sturmglas.com" rel="noopener noreferrer"&gt;sturmglas&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;Please subscribe to my newsletter on &lt;a href="https://winnekes.hashnode.dev" rel="noopener noreferrer"&gt;Hashnode&lt;/a&gt;. if you haven't done so already, feel free to leave a comment if you want to receive updates - I will soon embed a dedicated newsletter on &lt;a href="https://sturmglas.com" rel="noopener noreferrer"&gt;sturmglas&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;Please try out the app and give me your honest feedback! &lt;/p&gt;

</description>
      <category>javascript</category>
      <category>iot</category>
      <category>nextjs</category>
      <category>mentalhealth</category>
    </item>
    <item>
      <title>I Built an App with GitHub Copilot, Here's the Result</title>
      <dc:creator>Simona Winnekes</dc:creator>
      <pubDate>Fri, 16 Jul 2021 10:03:19 +0000</pubDate>
      <link>https://dev.to/winnekes/i-built-an-app-with-github-copilot-here-s-the-result-2mic</link>
      <guid>https://dev.to/winnekes/i-built-an-app-with-github-copilot-here-s-the-result-2mic</guid>
      <description>&lt;p&gt;I got my invitation to the technical preview of GitHub Copilot two days ago and have been pair programming a bit with my new AI buddy. Check out &lt;strong&gt;our&lt;/strong&gt; app &lt;a href="https://bamboozled.vercel.app/"&gt;Bamboozled&lt;/a&gt;, a minimal quiz (&lt;a href="https://github.com/winnekes/bamboozled-copilot-example"&gt;find the repository here&lt;/a&gt;).&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Please note&lt;/strong&gt;: Copilot is currently not available publicly, so if you want to test and review it, you have to &lt;a href="https://github.com/features/copilot/signup"&gt;join the waitlist&lt;/a&gt;.&lt;/p&gt;

&lt;h3&gt;
  
  
  But First, What Is GitHub Copilot?
&lt;/h3&gt;

&lt;p&gt;GitHub Copilot is "&lt;a href="https://copilot.github.com/"&gt;your AI pair programmer&lt;/a&gt;". It’s an AI-powered tool that can write code by itself, generating quite impressive programming functions, comments and more based on your directions. But what makes Copilot so unique is that it suggests auto-completions on the fly.&lt;/p&gt;

&lt;p&gt;It is important to note the difference between the auto-completion provided by your IDE and the one provided by Copilot: your IDE provides suggestions from locally indexed code while Copilot is &lt;strong&gt;capable of creating completely new output from the code it has learned&lt;/strong&gt; from public repos.&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;strong&gt;Trained on billions of lines of public code, GitHub Copilot puts the knowledge you need at your fingertips, saving you time and helping you stay focused.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;— GitHub&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h3&gt;
  
  
  Let's Have a Look at the Generated Code
&lt;/h3&gt;

&lt;p&gt;GitHub Copilot and I created a minimal quiz app. We fetch true or false questions from the &lt;a href="https://opentdb.com/api_config.php"&gt;Open Trivia API&lt;/a&gt;, let the user answer and at the end we display the score of correctly answered questions.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;First&lt;/strong&gt;: Let's render the &lt;code&gt;index.tsx&lt;/code&gt; or the home page.&lt;/p&gt;

&lt;p&gt;What I got was:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight tsx"&gt;&lt;code&gt;&lt;span class="cm"&gt;/* 
 render a Center with h="100vh" and a VStack with no props.
  The VStack is a stack of three elements:
  - a Heading with as="h1" and size="3xl" with Text "Bamboozled"
  - a Text with fontSize="xl" and pb={10} with Text "made by winnekes and Github Copilot"
  - if !isQuizRunning render  a Button component with the text "Start the quiz now", 
    size="lg" and onClick={() =&amp;gt; setIsQuizRunning(true)}
  - if IsQuizRunning render the Quiz component 
*/&lt;/span&gt;
  &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;
    &lt;span class="p"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nt"&gt;div&lt;/span&gt;&lt;span class="p"&gt;&amp;gt;&lt;/span&gt;
      &lt;span class="p"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nt"&gt;div&lt;/span&gt; &lt;span class="na"&gt;style&lt;/span&gt;&lt;span class="p"&gt;=&lt;/span&gt;&lt;span class="si"&gt;{&lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;height&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;100vh&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="si"&gt;}&lt;/span&gt;&lt;span class="p"&gt;&amp;gt;&lt;/span&gt;
        &lt;span class="p"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nt"&gt;div&lt;/span&gt; &lt;span class="na"&gt;style&lt;/span&gt;&lt;span class="p"&gt;=&lt;/span&gt;&lt;span class="si"&gt;{&lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;display&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;flex&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="na"&gt;flexDirection&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;column&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="si"&gt;}&lt;/span&gt;&lt;span class="p"&gt;&amp;gt;&lt;/span&gt;
          &lt;span class="p"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nt"&gt;h1&lt;/span&gt; &lt;span class="na"&gt;as&lt;/span&gt;&lt;span class="p"&gt;=&lt;/span&gt;&lt;span class="s"&gt;"h1"&lt;/span&gt; &lt;span class="na"&gt;style&lt;/span&gt;&lt;span class="p"&gt;=&lt;/span&gt;&lt;span class="si"&gt;{&lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;fontSize&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;3xl&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="si"&gt;}&lt;/span&gt;&lt;span class="p"&gt;&amp;gt;&lt;/span&gt;Bamboozled&lt;span class="p"&gt;&amp;lt;/&lt;/span&gt;&lt;span class="nt"&gt;h1&lt;/span&gt;&lt;span class="p"&gt;&amp;gt;&lt;/span&gt;
          &lt;span class="p"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nt"&gt;p&lt;/span&gt; &lt;span class="na"&gt;style&lt;/span&gt;&lt;span class="p"&gt;=&lt;/span&gt;&lt;span class="si"&gt;{&lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="na"&gt;fontSize&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;xl&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="na"&gt;paddingBottom&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;10px&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="si"&gt;}&lt;/span&gt;&lt;span class="p"&gt;&amp;gt;&lt;/span&gt;
            made by winnekes and Github Copilot
          &lt;span class="p"&gt;&amp;lt;/&lt;/span&gt;&lt;span class="nt"&gt;p&lt;/span&gt;&lt;span class="p"&gt;&amp;gt;&lt;/span&gt;
          &lt;span class="si"&gt;{&lt;/span&gt;&lt;span class="o"&gt;!&lt;/span&gt;&lt;span class="nx"&gt;isQuizRunning&lt;/span&gt; &lt;span class="o"&gt;&amp;amp;&amp;amp;&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;
            &lt;span class="p"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nt"&gt;button&lt;/span&gt;

              &lt;span class="na"&gt;style&lt;/span&gt;&lt;span class="p"&gt;=&lt;/span&gt;&lt;span class="si"&gt;{&lt;/span&gt;&lt;span class="p"&gt;{&lt;/span&gt;
                &lt;span class="na"&gt;fontSize&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;lg&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
                &lt;span class="na"&gt;border&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;none&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
                &lt;span class="na"&gt;background&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;none&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
                &lt;span class="na"&gt;color&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;white&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
                &lt;span class="na"&gt;padding&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;10px&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
                &lt;span class="na"&gt;borderRadius&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;3px&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;
              &lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="si"&gt;}&lt;/span&gt;

              &lt;span class="na"&gt;onClick&lt;/span&gt;&lt;span class="p"&gt;=&lt;/span&gt;&lt;span class="si"&gt;{&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;setIsQuizRunning&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="kc"&gt;true&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;&lt;span class="si"&gt;}&lt;/span&gt;
            &lt;span class="p"&gt;&amp;gt;&lt;/span&gt;
              Start the quiz now
            &lt;span class="p"&gt;&amp;lt;/&lt;/span&gt;&lt;span class="nt"&gt;button&lt;/span&gt;&lt;span class="p"&gt;&amp;gt;&lt;/span&gt;
          &lt;span class="p"&gt;)&lt;/span&gt;&lt;span class="si"&gt;}&lt;/span&gt;
          &lt;span class="si"&gt;{&lt;/span&gt;&lt;span class="nx"&gt;isQuizRunning&lt;/span&gt; &lt;span class="o"&gt;&amp;amp;&amp;amp;&lt;/span&gt; &lt;span class="p"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nc"&gt;Quiz&lt;/span&gt; &lt;span class="p"&gt;/&amp;gt;&lt;/span&gt;&lt;span class="si"&gt;}&lt;/span&gt;
        &lt;span class="p"&gt;&amp;lt;/&lt;/span&gt;&lt;span class="nt"&gt;div&lt;/span&gt;&lt;span class="p"&gt;&amp;gt;&lt;/span&gt;
      &lt;span class="p"&gt;&amp;lt;/&lt;/span&gt;&lt;span class="nt"&gt;div&lt;/span&gt;&lt;span class="p"&gt;&amp;gt;&lt;/span&gt;
    &lt;span class="p"&gt;&amp;lt;/&lt;/span&gt;&lt;span class="nt"&gt;div&lt;/span&gt;&lt;span class="p"&gt;&amp;gt;&lt;/span&gt;
  &lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt; 

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Not exactly what I want. I added &lt;a href="https://chakra-ui.com/"&gt;Chakra UI&lt;/a&gt; as a dependency, hoping that Copilot would import the necessary dependencies, but unfortunately no dice.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Next try&lt;/strong&gt;, after importing the necessary components:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight tsx"&gt;&lt;code&gt;&lt;span class="p"&gt;...&lt;/span&gt;
&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;Quiz&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;./quiz&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="k"&gt;import&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;Center&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;VStack&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;Heading&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;Text&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;Button&lt;/span&gt; &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;from&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;@chakra-ui/react&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="p"&gt;...&lt;/span&gt;
&lt;span class="cm"&gt;/* 
 render a Center with h="100vh" and a VStack with no props.
  The VStack is a stack of three elements:
  - a Heading with as="h1" and size="3xl" with Text "Bamboozled"
  - a Text with fontSize="xl" and pb={10} with Text "made by winnekes and Github Copilot"
  - if !isQuizRunning render  a Button component with the text "Start the quiz now", 
    size="lg" and onClick={() =&amp;gt; setIsQuizRunning(true)}
  - if IsQuizRunning render the Quiz component 
*/&lt;/span&gt;
  &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;
    &lt;span class="p"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nc"&gt;Center&lt;/span&gt; &lt;span class="na"&gt;h&lt;/span&gt;&lt;span class="p"&gt;=&lt;/span&gt;&lt;span class="s"&gt;"100vh"&lt;/span&gt;&lt;span class="p"&gt;&amp;gt;&lt;/span&gt;
      &lt;span class="p"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nc"&gt;VStack&lt;/span&gt;&lt;span class="p"&gt;&amp;gt;&lt;/span&gt;
        &lt;span class="p"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nc"&gt;Heading&lt;/span&gt; &lt;span class="na"&gt;as&lt;/span&gt;&lt;span class="p"&gt;=&lt;/span&gt;&lt;span class="s"&gt;"h1"&lt;/span&gt; &lt;span class="na"&gt;size&lt;/span&gt;&lt;span class="p"&gt;=&lt;/span&gt;&lt;span class="s"&gt;"3xl"&lt;/span&gt;&lt;span class="p"&gt;&amp;gt;&lt;/span&gt;
          Bamboozled
        &lt;span class="p"&gt;&amp;lt;/&lt;/span&gt;&lt;span class="nc"&gt;Heading&lt;/span&gt;&lt;span class="p"&gt;&amp;gt;&lt;/span&gt;
        &lt;span class="p"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nc"&gt;Text&lt;/span&gt; &lt;span class="na"&gt;fontSize&lt;/span&gt;&lt;span class="p"&gt;=&lt;/span&gt;&lt;span class="s"&gt;"xl"&lt;/span&gt; &lt;span class="na"&gt;pb&lt;/span&gt;&lt;span class="p"&gt;=&lt;/span&gt;&lt;span class="si"&gt;{&lt;/span&gt;&lt;span class="mi"&gt;10&lt;/span&gt;&lt;span class="si"&gt;}&lt;/span&gt;&lt;span class="p"&gt;&amp;gt;&lt;/span&gt;
          made by winnekes and Github Copilot
        &lt;span class="p"&gt;&amp;lt;/&lt;/span&gt;&lt;span class="nc"&gt;Text&lt;/span&gt;&lt;span class="p"&gt;&amp;gt;&lt;/span&gt;
        &lt;span class="si"&gt;{&lt;/span&gt;&lt;span class="nx"&gt;isQuizRunning&lt;/span&gt; &lt;span class="p"&gt;?&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;
          &lt;span class="p"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nc"&gt;Quiz&lt;/span&gt; &lt;span class="p"&gt;/&amp;gt;&lt;/span&gt;
        &lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;
          &lt;span class="p"&gt;&amp;lt;&lt;/span&gt;&lt;span class="nc"&gt;Button&lt;/span&gt; &lt;span class="na"&gt;size&lt;/span&gt;&lt;span class="p"&gt;=&lt;/span&gt;&lt;span class="s"&gt;"lg"&lt;/span&gt; &lt;span class="na"&gt;onClick&lt;/span&gt;&lt;span class="p"&gt;=&lt;/span&gt;&lt;span class="si"&gt;{&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;setIsQuizRunning&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="kc"&gt;true&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;&lt;span class="si"&gt;}&lt;/span&gt;&lt;span class="p"&gt;&amp;gt;&lt;/span&gt;
            Start the quiz now
          &lt;span class="p"&gt;&amp;lt;/&lt;/span&gt;&lt;span class="nc"&gt;Button&lt;/span&gt;&lt;span class="p"&gt;&amp;gt;&lt;/span&gt;
        &lt;span class="p"&gt;)&lt;/span&gt;&lt;span class="si"&gt;}&lt;/span&gt;
      &lt;span class="p"&gt;&amp;lt;/&lt;/span&gt;&lt;span class="nc"&gt;VStack&lt;/span&gt;&lt;span class="p"&gt;&amp;gt;&lt;/span&gt;
    &lt;span class="p"&gt;&amp;lt;/&lt;/span&gt;&lt;span class="nc"&gt;Center&lt;/span&gt;&lt;span class="p"&gt;&amp;gt;&lt;/span&gt;
  &lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Only after importing the components that I want to use here is Copilot able to give me the result that I wanted.&lt;/p&gt;

&lt;p&gt;Copilot can only play with the building blocks that you provide in an explicit context, it has absolutely no context of your code structure, dependencies and preferred ways of coding.&lt;/p&gt;




&lt;p&gt;&lt;strong&gt;Second&lt;/strong&gt;: The issue with the boolean questions provided by the API is that we don't get &lt;code&gt;true&lt;/code&gt; or &lt;code&gt;false&lt;/code&gt; as the answer but rather the string equivalents, &lt;code&gt;"True"&lt;/code&gt; and &lt;code&gt;"False"&lt;/code&gt;, so I asked the Copilot to create a method that converts string to boolean.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight tsx"&gt;&lt;code&gt;  &lt;span class="c1"&gt;// create a function called getBooleanFromString that returns true if the string is "True"&lt;/span&gt;
  &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;getBooleanFromString&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;value&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="kr"&gt;string&lt;/span&gt;&lt;span class="p"&gt;):&lt;/span&gt; &lt;span class="nx"&gt;boolean&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;value&lt;/span&gt; &lt;span class="o"&gt;===&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;True&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="p"&gt;};&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;That was simple and straightforward. If you take the provided comment you will probably get the same result as I did.&lt;/p&gt;




&lt;p&gt;&lt;strong&gt;Last&lt;/strong&gt;: Now I want to compare the user's answer with the question's correct answer and increment certain states. &lt;br&gt;
Copilot had some issues here.&lt;/p&gt;

&lt;p&gt;The result that I wanted for this hacky project:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight tsx"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;validateAnswer&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;answer&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;boolean&lt;/span&gt;&lt;span class="p"&gt;):&lt;/span&gt; &lt;span class="k"&gt;void&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="k"&gt;if&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;answer&lt;/span&gt; &lt;span class="o"&gt;===&lt;/span&gt; &lt;span class="nx"&gt;questions&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nx"&gt;currentQuestion&lt;/span&gt;&lt;span class="p"&gt;].&lt;/span&gt;&lt;span class="nx"&gt;correctAnswer&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="nx"&gt;setQuestionsCorrectlyAnsweredCount&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;questionsCorrectlyAnsweredCount&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;
    &lt;span class="nx"&gt;setCurrentQuestion&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;currentQuestion&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="p"&gt;};&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;What Copilot gave me with my first set of instructions:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight tsx"&gt;&lt;code&gt;&lt;span class="c1"&gt;// compare the answer of the user with questions[currentQuestion].correctAnswer&lt;/span&gt;
&lt;span class="c1"&gt;// in a function called validateAnswer&lt;/span&gt;
&lt;span class="c1"&gt;// and increment questionsCorrectlyAnsweredCount by one if the answer is correct.&lt;/span&gt;
&lt;span class="c1"&gt;// Then increment currentQuestion by one.&lt;/span&gt;
  &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;validateAnswer&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;answer&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="kr"&gt;string&lt;/span&gt;&lt;span class="p"&gt;):&lt;/span&gt; &lt;span class="nx"&gt;boolean&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;correctAnswer&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;questions&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nx"&gt;currentQuestion&lt;/span&gt;&lt;span class="p"&gt;].&lt;/span&gt;&lt;span class="nx"&gt;correctAnswer&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
    &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;correctAnswer&lt;/span&gt; &lt;span class="o"&gt;===&lt;/span&gt; &lt;span class="nx"&gt;answer&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="p"&gt;};&lt;/span&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;(I am avoiding perfect spelling, grammar and comment syntax on purpose to see the limitations of Copilot.)&lt;/p&gt;

&lt;p&gt;This is not what I want. &lt;code&gt;answer&lt;/code&gt; is not boolean, and the function isn't updating the state as instructed. Let's improve the comment a bit:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight tsx"&gt;&lt;code&gt;&lt;span class="c1"&gt;// Copilot, compare the answer(boolean) of the user with questions[currentQuestion].correctAnswer&lt;/span&gt;
&lt;span class="c1"&gt;// in a function called validateAnswer&lt;/span&gt;
&lt;span class="c1"&gt;// and increment questionsCorrectlyAnsweredCount by one if the answer is correct.&lt;/span&gt;
&lt;span class="c1"&gt;// Then increment currentQuestion by one.&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;validateAnswer&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;answer&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;boolean&lt;/span&gt;&lt;span class="p"&gt;):&lt;/span&gt; &lt;span class="nx"&gt;boolean&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;correctAnswer&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;getBooleanFromString&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;questions&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nx"&gt;currentQuestion&lt;/span&gt;&lt;span class="p"&gt;].&lt;/span&gt;&lt;span class="nx"&gt;correctAnswer&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
    &lt;span class="k"&gt;if&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;correctAnswer&lt;/span&gt; &lt;span class="o"&gt;===&lt;/span&gt; &lt;span class="nx"&gt;answer&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="nx"&gt;setQuestionsCorrectlyAnsweredCount&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;
        &lt;span class="nx"&gt;setQuestionsCorrectlyAnsweredCount&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;questionsCorrectlyAnsweredCount&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;
      &lt;span class="p"&gt;);&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;
    &lt;span class="nx"&gt;setCurrentQuestion&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;setCurrentQuestion&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;currentQuestion&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;));&lt;/span&gt;
    &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="kc"&gt;true&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
  &lt;span class="p"&gt;};&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Well, &lt;code&gt;answer&lt;/code&gt; is a boolean now. But the Copilot is for some reason using the method &lt;code&gt;getBooleanFromString&lt;/code&gt; that it created just before — maybe it is just very proud of the code it generated and wanted to use it. I don't know what spaghetti mess is happening with the state methods, and for some reason we are returning &lt;code&gt;true&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;Let's try one last time:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight tsx"&gt;&lt;code&gt;
&lt;span class="c1"&gt;// Copilot, in a function called validateAnswer compare the answer, a boolean value, with questions[currentQuestion].correctAnswer&lt;/span&gt;
&lt;span class="c1"&gt;// and increment questionsCorrectlyAnsweredCount by one using setQuestionsCorrectlyAnsweredCount if the answer is correct.&lt;/span&gt;
&lt;span class="c1"&gt;// Then always increment currentQuestion using setCurrentQuestion by one.&lt;/span&gt;
&lt;span class="c1"&gt;// Don't use the function getBooleanFromString!&lt;/span&gt;
&lt;span class="c1"&gt;// The function does not return anything.&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;validateAnswer&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;answer&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;boolean&lt;/span&gt;&lt;span class="p"&gt;):&lt;/span&gt; &lt;span class="k"&gt;void&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="k"&gt;if&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;answer&lt;/span&gt; &lt;span class="o"&gt;===&lt;/span&gt; &lt;span class="nx"&gt;questions&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nx"&gt;currentQuestion&lt;/span&gt;&lt;span class="p"&gt;].&lt;/span&gt;&lt;span class="nx"&gt;correctAnswer&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="nx"&gt;setQuestionsCorrectlyAnsweredCount&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;questionsCorrectlyAnsweredCount&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;
    &lt;span class="nx"&gt;setCurrentQuestion&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;currentQuestion&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
  &lt;span class="p"&gt;};&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Well, alright!&lt;/p&gt;

&lt;p&gt;The process is not perfect, I had to cycle through the alternative the Copilot could produce to get rid of the messy state methods, but it is impressive given that I was not very precise in describing what I want. &lt;/p&gt;

&lt;h3&gt;
  
  
  Will Coding with GitHub Copilot Save You Time?
&lt;/h3&gt;

&lt;p&gt;I compared the time spent on the app in two ways:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;I finished the app in 15 minutes by myself.&lt;/li&gt;
&lt;li&gt;Building the same app again together with GitHub Copilot took me a little over &lt;strong&gt;2 hours&lt;/strong&gt;!&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;It is definitely not efficient to rely on the Copilot for your complete codebase. For one, you have to be very precise and verbose in the instructions or function naming to achieve the desired result. &lt;br&gt;
In addition to that, you need to prepare before pair programming: that includes importing the functions and libraries that you want Copilot to use before giving instructions. I had to import components from Chakra UI first, otherwise the Copilot was falling back to basic HTML elements.&lt;/p&gt;

&lt;h3&gt;
  
  
  The Pros and Cons
&lt;/h3&gt;

&lt;p&gt;GitHub Copilot is far from perfect. You have to verify that the code does what it should do, you have to get rid of code smells and you have to test it thoroughly. It is not yet intelligent enough to code without interference.&lt;/p&gt;

&lt;p&gt;But used sparingly it can be useful, especially in the case of working with different language or even just with a new framework you know nothing about. For example, I didn't know the JSON structure of the Quiz API response beforehand, the Copilot was able to successfully map the response to my &lt;code&gt;Question&lt;/code&gt; type with little modification.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Pros:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;Write comments, get code!&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Auto-fill for repetitive code&lt;/strong&gt;: based on a few samples that you provide it can crank out a lot more suggestions (for example: you create an Array with &lt;code&gt;Question&lt;/code&gt; objects (keys being &lt;code&gt;question&lt;/code&gt; and &lt;code&gt;answer&lt;/code&gt;, provide a couple of questions and Copilot will add more! This is great for generating mock-data&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Automatic production of unit tests:&lt;/strong&gt; all you need to do is import your preferred testing library and let Copilot magically create a test for your code&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Cycle through alternatives&lt;/strong&gt;: it is up to you to reject or accept the generated code - you can tell Copilot to generate code in a different way&lt;/li&gt;
&lt;li&gt;Learn how to use a new framework without spending your time on reading documentation&lt;/li&gt;
&lt;li&gt;GitHub Copilot works with almost every programming language, but at the moment you get the &lt;strong&gt;best results&lt;/strong&gt; with &lt;strong&gt;Python&lt;/strong&gt;, &lt;strong&gt;JavaScript&lt;/strong&gt; or &lt;strong&gt;TypeScript&lt;/strong&gt;.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Cons:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Code smell:&lt;/strong&gt; the generated code is not perfect, it sometimes seems as if it was frankensteined together from different codebases (which it most definitely is)&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Copilot does not know the context of your codebase&lt;/strong&gt;: the tool can only be used on a file to file basis. It does not take your best practices, your code structure or existing utility methods into considerations.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Import desired modules first&lt;/strong&gt;: I added Axios as a dependency in my project, but Copilot fell back to using Fetch&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;It will be a paid service&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Possible copyright infringement:&lt;/strong&gt; Developers have shared that the tool has "created" snippets which have been taken verbatim from public repositories. Depending on the license of the code, this could get you into legal trouble, as GitHub states that &lt;strong&gt;you and you alone are responsible for the generated code&lt;/strong&gt; if you decide to use it on your code.
"Unfortunately, the user has no way of knowing if the algorithm made a particular piece of code up by itself or stole it from a code repository protected by a license", says &lt;a href="https://medium.com/geekculture/githubs-ai-copilot-might-get-you-sued-if-you-use-it-c1cade1ea229"&gt;Jacob Bergdahl&lt;/a&gt;.&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  No, GitHub Copilot is Not Stealing Our Dev Jobs
&lt;/h3&gt;


&lt;blockquote&gt;
&lt;p&gt;Developers should be as afraid of GitHub Copilot as mathematicians are of calculators.&lt;/p&gt;— Kelsey Hightower (@kelseyhightower) &lt;a href="https://twitter.com/kelseyhightower/status/1412855977452490755?ref_src=twsrc%5Etfw"&gt;July 7, 2021&lt;/a&gt;
&lt;/blockquote&gt; 

&lt;p&gt;I doubt I will ever use the GitHub Copilot on a daily basis, definitely not in professional settings like work for a client or while employed. When your time is costly and precious, correcting GitHub Copilot's code is tedious and gets too frustrating. I am concerned about the copyright issues, and frankly, it is far from replacing a mentor or coding buddy. Using the AI tool will not end the era of asking questions on Stack Overflow or reading through documentations. At the moment, for a seasoned developer, it's a fun program to play with. For a new developer, it's definitely not going to improve your skills.&lt;/p&gt;

&lt;p&gt;Though it seems that GitHub Copilot will be a paid service, OpenAI will release the Codex soon to the public. Developers will be able to leverage the &lt;a href="https://openai.com/"&gt;"AI that translates natural language into code"&lt;/a&gt; in their own projects — this is promising for low code applications, making code more accessible, or for teaching children how to code.&lt;/p&gt;

&lt;p&gt;What do you think of GitHub Copilot? Have you tried it out yourself? I want to hear from you!&lt;/p&gt;

</description>
      <category>githubcopilot</category>
      <category>openai</category>
      <category>typescript</category>
      <category>github</category>
    </item>
    <item>
      <title>How to Get Started with Contributing to Open Source</title>
      <dc:creator>Simona Winnekes</dc:creator>
      <pubDate>Tue, 13 Jul 2021 09:57:05 +0000</pubDate>
      <link>https://dev.to/winnekes/so-you-want-to-contribute-to-open-source-33mo</link>
      <guid>https://dev.to/winnekes/so-you-want-to-contribute-to-open-source-33mo</guid>
      <description>&lt;p&gt;I love TypeScript, and have loved it since I was first introduced to it in my &lt;a href="https://codaisseur.com" rel="noopener noreferrer"&gt;coding bootcamp&lt;/a&gt; and now refuse to go back to plain old JavaScript. I love it for the safety and predictability, and when done right, the self-documenting nature of strong types.&lt;/p&gt;

&lt;p&gt;At my previous job, I wanted a way to create a living handbook for new interns to quickly test and learn new things. I found &lt;a href="https://github.com/winnekes/itypescript" rel="noopener noreferrer"&gt;ITypeScript&lt;/a&gt;, a kernel for &lt;a href="https://jupyter.org/" rel="noopener noreferrer"&gt;Jupyter Notebook&lt;/a&gt;, and played around with it. I was happy that it worked right out of the box. &lt;/p&gt;

&lt;p&gt;I was learning a lot of new things at the time and when I saw that the project owner was looking for a new maintainer, I made a spur-of-the-moment decision to request, and accept the role. Perhaps if I had looked a bit deeper, I wouldn't have been so quick to accept ownership.&lt;/p&gt;

&lt;p&gt;It was overwhelming. The documentation was lacking, the project was a minimal fork of the JavaScript kernel, and there were various issues reported by users. I let the project sit for a couple of months as I was unsure of how to approach it.&lt;/p&gt;

&lt;p&gt;In the meantime, I had worked on different projects, both professionally and in my free time and had built my skills up. With the confidence that gave me, about two weeks ago I decided to get over my fear of failure and dive into the ITypeScript library. I went through the code line by line to understand how the implementation of a custom kernel for Jupyter Notebook works.&lt;/p&gt;

&lt;p&gt;It all seemed much simpler now, and I noticed that there was something useful I could already do. I decided to update all the dependencies in the library to their latest versions. Vulnerabilities in outdated packages are a serious matter, and new features are a definite added bonus.&lt;/p&gt;

&lt;p&gt;I tested the code, updated a few more files, reached out to the original author for permission to publish a new version to NPM, and released an updated version to the world! With it came a sense of relief to have finally started working on this daunting project. &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;But if I had to do it again now, I would have done things differently.&lt;/strong&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%2Fmedia3.giphy.com%2Fmedia%2FjxzEhHBMmH7tm%2Fgiphy.gif%3Fcid%3Decf05e47elzyraf91aq99fbq1hbi7pjwl087qcneq1k4wmeb%26rid%3Dgiphy.gif%26ct%3Dg" 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%2Fmedia3.giphy.com%2Fmedia%2FjxzEhHBMmH7tm%2Fgiphy.gif%3Fcid%3Decf05e47elzyraf91aq99fbq1hbi7pjwl087qcneq1k4wmeb%26rid%3Dgiphy.gif%26ct%3Dg" alt="I should have prepared better"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  But First - Why Everyone, Junior or Senior, Should Contribute to Open Source Projects
&lt;/h3&gt;

&lt;p&gt;Contributing to open source comes with a lot of benefits and it really does not matter how experienced you are. &lt;strong&gt;I'd wager that the lesser experience you have the more value you get out of it for your career and personal development!&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Knowledge and learning comes with a lot of practice over several years. But as an aspiring developer it is almost impossible to get real-life experience before your first job. There's only so much that mock projects, tutorials, and making To-Do apps can teach you. Unless you have a dedicated mentor, it is difficult to get professional feedback on the quality of your code and execution.&lt;/p&gt;

&lt;p&gt;Contributing to an open-source project is the real deal! You will learn how to work with an existing codebase (often a massive one), you will get feedback from experienced developers in the form of code reviews, and you will (hopefully) learn industry practices and standards along the way.&lt;/p&gt;

&lt;p&gt;When interviewing for a junior role, candidates fresh out of university with a Computer Science degree are often asked questions about computer theory or thesis projects. Interviewing when you don't have that background, or some professional experience, can be difficult for both you and the interviewer. In lieu of professional work experience, contribution to open source will help you stand out. You conversations with potential employers can now be shaped around awesome topics that you enjoy and contribute to.&lt;/p&gt;

&lt;p&gt;You also start building your very own network of peers and mentors early on, maybe even before your first role in development. Who knows, you might come across someone who will warmly recommend you in their own network!&lt;/p&gt;

&lt;h3&gt;
  
  
  There Are Many Ways That One Can Contribute to Open Source
&lt;/h3&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%2F0Mgv9Mz.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%2Fi.imgur.com%2F0Mgv9Mz.gif" alt="Ooof"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Contributing to a project for the first time can feel overwhelming. Big companies with real projects might depend on the software, industry veterans might judge your code, and every issue can seem way above your skill level. Don't let any of those thoughts dissuade you from participating in this awesome process — contribution comes in different forms, some of them don't even include writing a single line of code!&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;There are many other ways to help:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://github.com/chakra-ui/chakra-ui/discussions/2169" rel="noopener noreferrer"&gt;Participate in discussions, you might know the solution to an issue&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://github.com/tensorflow/examples" rel="noopener noreferrer"&gt;Build and share a new example for the project with the owners or the community, especially if they already collect examples&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://crowdin.com/project/openproject" rel="noopener noreferrer"&gt;Provide a translation in your native language&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://yihui.org/en/2013/06/fix-typo-in-documentation/" rel="noopener noreferrer"&gt;Fix typos in comments or documentation&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://github.com/supabase/supabase/issues/2205" rel="noopener noreferrer"&gt;Test the project, and report bugs and provide feedback&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://www.writethedocs.org/guide/writing/beginners-guide-to-docs/" rel="noopener noreferrer"&gt;Improve or offer to write documentation for the project if writing is one of your stronger suits&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;&lt;a href="https://fossbytes.com/linus-torvaldss-famous-email-first-linux-announcement/" rel="noopener noreferrer"&gt;Create your very own open source project&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Some of these are easier than others — go with your gut here, and listen to the community's wishes. &lt;/p&gt;

&lt;h3&gt;
  
  
  An Opinionated Checklist Before You Contribute
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://i.giphy.com/media/4xWGyVKoXqg2eVCiq9/giphy.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://i.giphy.com/media/4xWGyVKoXqg2eVCiq9/giphy.gif" alt="You better check your list, twice"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Jumping straight into coding is acceptable for hackathons, quick-and-dirty hacks, and proof of concepts. But there are many steps to consider before you start working on an open-source project. For one, you are no longer working alone but collaborating with other developers; every project has its own mission and vision, and guidelines on how to contribute. The last thing you want is to be stuck with an inactive or even dead-end project where your contribution adds no value.&lt;/p&gt;

&lt;p&gt;It is very easy to get overwhelmed at the sheer complexity of some projects. It is best to not look at those right away but to choose a small-scale project with an active userbase.&lt;/p&gt;

&lt;p&gt;The important items on my checklist now are:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;License&lt;/strong&gt;: the project &lt;strong&gt;must&lt;/strong&gt; have an &lt;a href="https://opensource.org/licenses" rel="noopener noreferrer"&gt;open-source license&lt;/a&gt;. If it does not then the project is not open-source and you are legally not allowed to use, copy or modify said project. A license protects both contributors and users of the project.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Read the guidelines&lt;/strong&gt;: in the docs you will usually find proper details on how to &lt;a href="https://github.com/github/docs/blob/main/CONTRIBUTING.md" rel="noopener noreferrer"&gt;contribute&lt;/a&gt; and the possible &lt;a href="https://github.com/github/docs/blob/main/CODE_OF_CONDUCT.md" rel="noopener noreferrer"&gt;code of conduct&lt;/a&gt;. Make sure to read it thoroughly before contributing and remember, the guidelines can vastly differ from project to project. Some projects do not accept  pull requests before an issue is raised and discussed, or there is a proper structure required when you report bugs. Again, &lt;strong&gt;don't waste your own time&lt;/strong&gt;, read up!&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Check the general "health" of the project&lt;/strong&gt;: 

&lt;ul&gt;
&lt;li&gt;Is the project active and maintained? Don't start your open-source journey by contributing to inactive projects. As a beginner you need quick and constructive feedback.&lt;/li&gt;
&lt;li&gt;Is the community welcoming and open? I judge this quality by going through the issues and reading the responses of the maintainers/contributors critically. Reading up on code reviews and how feedback is given is very insightful as well! &lt;/li&gt;
&lt;li&gt;Is the code structure clear to you? &lt;/li&gt;
&lt;li&gt;Are there standards for submitting issues, reporting bugs, and pull requests?&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;

&lt;strong&gt;Do you have experience with the main language/tech stack?&lt;/strong&gt; Learning on the go is never a bad thing, but I believe you should know some of the technologies used in the project before you start contributing.  Best practices can vastly differ from language to language. The more experienced you are in the tech stack, the more confident you can be in your PR, and the easier it might be for others to review your work.&lt;/li&gt;

&lt;/ul&gt;

&lt;h3&gt;
  
  
  How to Select a Project for Your First Contribution
&lt;/h3&gt;

&lt;p&gt;One way to find a project to work on is to look to the tools you are already using in your own projects. For example, do you use &lt;a href="https://github.com/typeorm/typeorm" rel="noopener noreferrer"&gt;TypeORM&lt;/a&gt; and are you frustrated that there is no easy way of adding scopes to your general queries? I am! &lt;a href="https://github.com/typeorm/typeorm/issues/1601" rel="noopener noreferrer"&gt;And so are a few others when I was looking for an existing issue&lt;/a&gt;. So I'll take a crack at it whenever time permits.&lt;/p&gt;

&lt;p&gt;Most contributions stem from a feeling of frustration about bugs or lack of features the contributors feel are necessary to make a project even more awesome.&lt;/p&gt;

&lt;p&gt;So go through the issues of your favourite library or framework, participate in the discussions with the community, and maybe come up with a solution to a problem you feel like you can handle. 💪&lt;/p&gt;

&lt;p&gt;And, if you are not using it, you are unlikely to contribute effectively in the long term, either due to lack of understanding what the project is all about or lack of interest after some time.&lt;/p&gt;

&lt;p&gt;If you don't have a certain project in mind but want to get started anyway, here are a couple of  gateways into your first open-source contribution:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;p&gt;&lt;a href="https://github.com/firstcontributions/first-contributions" rel="noopener noreferrer"&gt;First Contributions&lt;/a&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;This is is an tutorial on how to contribute to an open source project. The awesome thing is that when you complete the tutorial you will have made your first open source contribution!&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;li&gt;

&lt;p&gt;&lt;a href="https://goodfirstissue.dev" rel="noopener noreferrer"&gt;Good First Issue&lt;/a&gt; or &lt;a href="https://up-for-grabs.net" rel="noopener noreferrer"&gt;Up For Grabs&lt;/a&gt; &lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;You'll find curated issues for aspiring contributors to tackle from popular open-source projects.&lt;/li&gt;
&lt;li&gt;You can search and filter by difficulty and language.&lt;/li&gt;
&lt;/ul&gt;


&lt;/li&gt;

&lt;/ul&gt;




&lt;p&gt;&lt;strong&gt;However, there are other ways to contribute to the community, not just through open-source projects.&lt;/strong&gt; &lt;/p&gt;

&lt;p&gt;You can ask and answer questions on platforms such as Stack Overflow or Quora, join discussions in Discord or IRC channels that are run by the maintainers of the project, and organise or participate in Meetups about technologies.&lt;/p&gt;

&lt;p&gt;I'm still at the start of my open-source journey, and this was a brief overview of my experience and understanding. I would love to hear from you if you want a more in-depth look at certain aspects of open-source contribution! I would also love to hear about your first open-source adventure! &lt;/p&gt;

&lt;p&gt;Happy hacking!&lt;/p&gt;

</description>
      <category>opensource</category>
      <category>beginners</category>
      <category>contributorswanted</category>
    </item>
    <item>
      <title>Why I hung up my Stethoscope and became a Web Developer</title>
      <dc:creator>Simona Winnekes</dc:creator>
      <pubDate>Sat, 10 Jul 2021 09:31:40 +0000</pubDate>
      <link>https://dev.to/winnekes/why-i-hung-up-my-stethoscope-and-became-a-web-developer-oa6</link>
      <guid>https://dev.to/winnekes/why-i-hung-up-my-stethoscope-and-became-a-web-developer-oa6</guid>
      <description>&lt;h2&gt;
  
  
  👋 Hello there.
&lt;/h2&gt;

&lt;p&gt;I'm Simona, a German web developer living in Amsterdam. I'm crazy about all things full-stack: &lt;strong&gt;front end&lt;/strong&gt;, &lt;strong&gt;back end&lt;/strong&gt; and recently &lt;strong&gt;devops&lt;/strong&gt; as well.&lt;/p&gt;

&lt;p&gt;This is quite a recent development. However, my journey started differently.&lt;/p&gt;

&lt;h2&gt;
  
  
  🩺 Once upon a time I was ...
&lt;/h2&gt;

&lt;p&gt;... a nurse. Yes, I know. "How did that happen?"&lt;br&gt;
This is a question I'm happy to answer everyone who asks.&lt;/p&gt;

&lt;p&gt;I only ever had &lt;strong&gt;two&lt;/strong&gt; lifelong dreams:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;be a heart surgeon 🫀&lt;/li&gt;
&lt;li&gt;build a robot 🤖&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;I hit my first roadblock very soon after school; my father was diagnosed with lung cancer. My mother had been battling illnesses for a while as well so I had to adjust my road map a bit.&lt;br&gt;
Instead of studying medicine I decided to go for a medicine-adjacent career before switching tracks back to medicine - I would be earning money and knowledge from day 1 instead of spending several years at university.&lt;/p&gt;

&lt;p&gt;As a nurse I was able to care for my father and the family. I graduated from nursing school back in 2015 and became a cardiac nurse.&lt;/p&gt;

&lt;p&gt;It was an amazing time: working with great and intelligent colleagues, while also learning from and teaching doctors. I enjoyed the thrill of saving lives, given that we were a high risk ward for cardiac arrests, blockages and many, many other heart related problems. Often there was nothing better than a cold beer (or several) at 7 in the morning at the local hospital bar after a particularly rough night shift.&lt;/p&gt;

&lt;p&gt;I climbed ranks quickly, I became an official student mentor, came up with safety programs, and towards the end of my nursing career I was one of the youngest head nurses of the cardiac wing.&lt;/p&gt;

&lt;h2&gt;
  
  
  🤔 Why did I ditch my scrubs for slacks though?
&lt;/h2&gt;

&lt;p&gt;Burnout is real, and a serious problem in the medical world. &lt;/p&gt;

&lt;p&gt;I believed I would thrive as head nurse of cardiology - I mean, I was young and had already achieved so much in just 3 years. I thought I knew what the role would entail, and it seemed quite doable to me.&lt;/p&gt;

&lt;p&gt;But it came with many downsides that I soon discovered, including:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Zero work-life balance.&lt;/strong&gt; I often worked 12-14 days in a row with all kinds of shifts intermixed in that time frame, with only 1-2 days of breaks in between. &lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Increasing amounts of responsibility and unfulfilled promises&lt;/strong&gt;. The job was supposed to come with two second-in-commands to delegate various tasks to. Unfortunately we were understaffed and overbooked, and I had no assistance during my time as the head nurse.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Everyone was miserable.&lt;/strong&gt; My colleagues, doctors, patients — it was such a negative and borderline toxic environment, you always took the misery home with you.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;My boyfriend, a lifelong developer, was not happy that I was not happy. Back then we were in a long-distance relationship and he kept urging me to switch careers.&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;"Become a developer, you will love it! I think it's something you'd be great at!"&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;I didn't quite believe him then as I couldn't even think of leaving the world of health care, I still had so much passion for medicine, nursing and cardiology.&lt;/p&gt;

&lt;p&gt;But towards the end of 2018 I had to take sick leave for a week to recoup after a particular rough patch. That &lt;strong&gt;week&lt;/strong&gt; turned into &lt;strong&gt;three months&lt;/strong&gt; of trying to get over the severe burnout I was going through. I never returned back to that role, or that hospital.&lt;/p&gt;




&lt;p&gt;As a nurse, I found myself sleeping when I wasn't working with no time for my hobbies. I wanted to focus back on them.&lt;/p&gt;

&lt;p&gt;Coding was one of those hobbies — or should I rather say "coding". When I was about 12 years old I joined the computer club at my school and learned how to build small, blinking and loud websites with HTML and CSS. I was hooked.&lt;/p&gt;

&lt;p&gt;A bit later I read all of the Lord of the Rings series and a few friends and I thought it would be super cool to learn Sindarin, the Elven language made up by Tolkien. Unfortunately all resources on the subject were only available in English, and my friends spoke only German. I had the idea of creating a dictionary and lecture platform, &lt;strong&gt;German &amp;lt;&amp;gt; Sindarin&lt;/strong&gt;. HTML and CSS wouldn't be enough. I had to store the translations and lectures, and more importantly allow searching for words in the dictionary. I learnt PHP and MySQL, the most popular and easiest combination back then to do this, especially in Germany.&lt;/p&gt;

&lt;p&gt;I decided to dust off my coding boots, and get back on the road. I started learning some Python and refreshing my HTML skills, but found it a big hill to climb by myself.&lt;/p&gt;

&lt;h2&gt;
  
  
  💡 Moving to Amsterdam, surviving a coding bootcamp and getting my first job
&lt;/h2&gt;

&lt;p&gt;Fast forward to the end of 2019. My boyfriend had moved to Amsterdam some time before that and it was the perfect time to bridge the distance and move to Amsterdam.&lt;br&gt;
I was thinking of being a nurse here as well, but to be a nurse in the Netherlands, I would have to re-qualify, and also be a proficient speaker in Dutch. This would take some time, and I kind of needed a change as well for my mental health, so I started weighing my options. My boyfriend heavily suggested I give up being a nurse and switch to development.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Studying computer science for several years was not an option for me. I wanted a job as soon as possible as I already had work experience of nearly 8 years.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;A &lt;strong&gt;coding bootcamp&lt;/strong&gt; was the answer for me and I believe it is also the future of web development education. During the time it would take to get back to the role I'd just burnt out from, I could switch careers to a hobby I'd started to enjoy again. I interviewed with quite a few bootcamps in Amsterdam and eventually decided to accept the offer at &lt;a href="https://codaisseur.com"&gt;Codaisseur&lt;/a&gt; for their intensive 11-week full-stack web development course. &lt;/p&gt;

&lt;p&gt;It was the &lt;strong&gt;best decision&lt;/strong&gt; I had made in a very long time.&lt;/p&gt;

&lt;p&gt;I found my first job as a full-stack developer in March 2020 (within two months of graduating from the bootcamp), and guess what: &lt;/p&gt;

&lt;p&gt;I joined a health care company that provides a platform for freelance nurses to choose where they want to work! &lt;br&gt;
Talk about &lt;strong&gt;a&lt;/strong&gt; &lt;strong&gt;match made in heaven&lt;/strong&gt;.&lt;/p&gt;

&lt;h2&gt;
  
  
  📝 What now
&lt;/h2&gt;

&lt;p&gt;That is it for my introduction, more posts will follow soon!&lt;/p&gt;

&lt;p&gt;I will be talking more about my career switch, my experience with bootcamps, everything about my first job as a developer (and how to get one if you don't come from an academic background) in this blog series &lt;strong&gt;From Scrubs to Slacks&lt;/strong&gt;.&lt;/p&gt;

&lt;p&gt;But I will not only talk of career-related topics but also provide tutorials, tips and tricks around web development.&lt;/p&gt;

&lt;p&gt;I have taken so much knowledge and help from the dev community, it is time to start giving back. ✌️&lt;/p&gt;

&lt;p&gt;One more thing:&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;I'm building my frickin' robot!&lt;/strong&gt; 🤖&lt;/p&gt;

&lt;p&gt;More on that project in the next coming weeks here on DEV and other platforms (see below).&lt;/p&gt;

&lt;h2&gt;
  
  
  🔗 Let's connect!
&lt;/h2&gt;

&lt;p&gt;Starting my career as a developer during Covid has been a lonely time — I look forward to joining the DEV community and connecting with fellow code enthusiasts. &lt;/p&gt;

&lt;p&gt;And if you know someone in a similar situation — wanting to switch careers to development but not knowing where and how to start — please point them in my direction!&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;a href="https://github.com/winnekes"&gt;Github&lt;/a&gt; &lt;/li&gt;
&lt;li&gt;&lt;a href="https://linkedin.com/in/winnekes"&gt;LinkedIn&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://instagram.com/robotsandcats"&gt;Instagram&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>career</category>
      <category>webdev</category>
      <category>bootcamp</category>
    </item>
  </channel>
</rss>
