<?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: Christoffer Niska</title>
    <description>The latest articles on DEV Community by Christoffer Niska (@crisu83).</description>
    <link>https://dev.to/crisu83</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%2F1188532%2F7fa3342a-05be-48be-a388-90ffd54c95f6.png</url>
      <title>DEV Community: Christoffer Niska</title>
      <link>https://dev.to/crisu83</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/crisu83"/>
    <language>en</language>
    <item>
      <title>Building CodeHub: Crafting the Technology Stack</title>
      <dc:creator>Christoffer Niska</dc:creator>
      <pubDate>Sun, 04 Feb 2024 19:50:55 +0000</pubDate>
      <link>https://dev.to/codehub/building-codehub-crafting-the-technology-stack-8bk</link>
      <guid>https://dev.to/codehub/building-codehub-crafting-the-technology-stack-8bk</guid>
      <description>&lt;p&gt;As we continue our journey in building CodeHub, we'll now shift our focus to the technology stack that powers our platform. In case you missed the beginning of our story, you can &lt;a href="https://dev.to/codehub/building-codehub-our-journey-begins"&gt;catch up on the origins of CodeHub&lt;/a&gt; to understand how it all began.&lt;/p&gt;

&lt;h2&gt;
  
  
  Choosing the right technologies
&lt;/h2&gt;

&lt;p&gt;Given our extensive experience with &lt;a href="https://www.typescriptlang.org/"&gt;TypeScript&lt;/a&gt;, &lt;a href="https://react.dev/"&gt;React&lt;/a&gt;, and &lt;a href="https://nextjs.org/"&gt;Next.js&lt;/a&gt;, choosing these technologies was an obvious decision. We were eager to launch our service as quickly as possible.&lt;/p&gt;

&lt;p&gt;For server-to-client communication, we opted for &lt;a href="https://graphql.org/"&gt;GraphQL&lt;/a&gt; due to its strong typing, self-documenting capabilities, and the availability of numerous &lt;a href="https://the-guild.dev/"&gt;helpful libraries&lt;/a&gt;. We selected &lt;a href="https://www.apollographql.com/"&gt;Apollo&lt;/a&gt; as our GraphQL server and client. My prior experience with Apollo, along with its built-in &lt;a href="https://www.apollographql.com/docs/react/caching/overview/"&gt;caching features&lt;/a&gt; and robust &lt;a href="https://www.apollographql.com/docs/react/development-testing/developer-tooling/#apollo-client-devtools"&gt;developer tools&lt;/a&gt;, influenced our choice.&lt;/p&gt;

&lt;p&gt;Recognizing the relational nature of our data, we embraced &lt;a href="https://www.postgresql.org/"&gt;PostgreSQL&lt;/a&gt; for its rich feature set. As our database client, we settled on &lt;a href="https://www.prisma.io/client"&gt;Prisma&lt;/a&gt;, primarily for its schema prototyping capabilities with db push.&lt;/p&gt;

&lt;p&gt;Next, we needed to decide on a user interface library. Our requirements were clear: a library with a rich collection of components. After brief research, we settled on &lt;a href="https://chakra-ui.com/"&gt;Chakra UI&lt;/a&gt; for its simplicity, modularity, accessibility, and extensive component library. Its use of &lt;a href="https://styled-system.com"&gt;Styled System&lt;/a&gt;, with which I was familiar, further solidified our choice.&lt;/p&gt;

&lt;p&gt;Finally, we had to select a platform for deployment. Having previously used &lt;a href="https://vercel.com"&gt;Vercel&lt;/a&gt; for deploying Next.js projects, it was the natural choice. We also decided to explore Vercel's new offerings, including &lt;a href="https://vercel.com/storage/postgres"&gt;serverless PostgreSQL&lt;/a&gt; and &lt;a href="https://vercel.com/storage/blob"&gt;fast object storage&lt;/a&gt;.&lt;/p&gt;

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

&lt;p&gt;In the upcoming part of this series, I'll share our journey in selecting the code editor for CodeHub. Trust me, it wasn't an easy task to find a solution that met all our needs.&lt;/p&gt;

&lt;p&gt;Stay tuned for more.&lt;/p&gt;

</description>
    </item>
    <item>
      <title>Building CodeHub: Our Journey Begins</title>
      <dc:creator>Christoffer Niska</dc:creator>
      <pubDate>Wed, 22 Nov 2023 13:16:43 +0000</pubDate>
      <link>https://dev.to/codehub/building-codehub-our-journey-begins-404c</link>
      <guid>https://dev.to/codehub/building-codehub-our-journey-begins-404c</guid>
      <description>&lt;p&gt;This is the first part of our journey in creating &lt;a href="https://codehub.foo"&gt;CodeHub&lt;/a&gt;.&lt;/p&gt;

&lt;h2&gt;
  
  
  What is CodeHub?
&lt;/h2&gt;

&lt;p&gt;CodeHub is an online community for developers, focused on sharing code snippets. You can create an account, vote on snippets, mark them as favorites for future reference, leave comments, and easily share them on social media.&lt;/p&gt;

&lt;h2&gt;
  
  
  But wait, doesn't such a service already exist?
&lt;/h2&gt;

&lt;p&gt;Not exactly. While there are services with similar features, let's explore what sets CodeHub apart. &lt;a href="https://gist.github.com/"&gt;GitHub Gist&lt;/a&gt; allows users to share files, but it doesn't foster a sense of community. &lt;a href="https://stackoverflow.com/"&gt;Stack Overflow&lt;/a&gt; is a well-known developer community, but it primarily serves as a platform for asking and answering development-related questions. Additionally, services like CodePen offer an online code editing environment that's popular among front-end developers for creating and sharing HTML, CSS, and JavaScript snippets.&lt;/p&gt;

&lt;h2&gt;
  
  
  How it all began
&lt;/h2&gt;

&lt;p&gt;Our story starts on a casual Friday evening in Helsinki last August, as we enjoyed a few drinks with friends and former colleagues after work. Conversation meandered through various topics until someone suggested how great it would be to have a platform where developers could easily exchange useful code snippets.&lt;/p&gt;

&lt;p&gt;The idea quickly captured our imagination, and one of my friends, who was currently between projects, proposed that we should embark on creating this platform. To our amusement, the others initially thought we were joking. Little did they know that we had already committed to making this vision a reality. The very next day, we set the wheels in motion to create CodeHub.&lt;/p&gt;

&lt;h2&gt;
  
  
  The vision
&lt;/h2&gt;

&lt;p&gt;At this point, we had a clear vision in our heads of what the service would look like. We knew that we wanted to keep the features to a minimum, at least in the beginning, and gather feedback from users before adding additional features.&lt;/p&gt;

&lt;p&gt;The code editor needed to be simple; it didn't have to be a full-fledged editor, but it had to include syntax highlighting and serve its primary purpose, which was to enable users to modify their snippets without the need to copy them to an external editor and then back to the service.&lt;/p&gt;

&lt;p&gt;I also recognized that the ability to generate preview images of the snippets was an essential feature for our service. This capability would enable us to provide an appealing preview of the code, complete with syntax highlighting, when a user shared a link to a snippet on social media.&lt;/p&gt;

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

&lt;p&gt;Our journey is just beginning, and in the next part, we'll delve into the technical decisions that powered the development of CodeHub. Join us as we explore the technology stack, tools, and building blocks that bring our community for developers to life.&lt;/p&gt;

&lt;p&gt;Stay tuned for more.&lt;/p&gt;

</description>
    </item>
    <item>
      <title>Hello World!</title>
      <dc:creator>Christoffer Niska</dc:creator>
      <pubDate>Wed, 18 Oct 2023 17:07:28 +0000</pubDate>
      <link>https://dev.to/crisu83/hello-world-12m7</link>
      <guid>https://dev.to/crisu83/hello-world-12m7</guid>
      <description>&lt;p&gt;I'm here to test whether Dev Community's post feature is sufficient for my current needs.&lt;/p&gt;

</description>
    </item>
  </channel>
</rss>
