Creating a Link-Sharing Site Part 0
Tags: javascript, webdev, programming
Published: 2022-02-19 21:24:35

## Introduction
Welcome to a new series of blog posts. In this series I will be sharing my progress on a new project. What's the new project? I want to create a link-sharing site similar to [HackerNews](https://news.ycombinator.com/) but with the flexibility of [StackExchange](https://stackexchange.com/).
Read on for more details.

---
## Motivation - Why am I doing this?
As an avid reader of [HackerNews](https://news.ycombinator.com/) one day I started to wonder if this kind of site exists in other domains. I knew that aggregators were popular in areas like finding new music but these tend to be more complex.

The thing I love about HackerNews is the organic growth of different links. When a link is shared on the site it is not surrounded by some long description or backstory. Just the title of the page. This means that the quality of the link is evaluated by readers based on the content rather than how well the poster is able to dress up the page with a misleading or exaggerating description.

As a developer, I also spend a lot of time on another site, [StackOverflow](https://stackoverflow.com/) or more generally, [StackExchange](https://stackexchange.com/). One interesting thing I find about StackExchange is the way that it has taken a concept which works in separate domains and implemented it across them separately. For example, as well as StackOverflow for programming, there is also [english.stackexchange.com](english.stackexchange.com) and [mathematics.stackexchange.com](mathematics.stackexchange.com) for English and maths respectively. See a full list here: [https://stackexchange.com/sites](https://stackexchange.com/sites).

Considering these two sites I spend an awful lot of time on, I thought I would try to create a network of link sharing sites across different domains.

---

## Showing My Work
Recently, I finished reading ['Show Your Work!' by Austin Kleon](https://www.goodreads.com/book/show/18290401-show-your-work) (and I highly recommend it)! To complement this, I recently listened to [a great Indie Hackers podcast with Josh Pigford](https://www.indiehackers.com/podcast/006-josh-pigford-of-baremetrics). Both of these inspired me to get into the habit of sharing my work. My blog itself is still in its infancy and I am trying to build up a habit of  posting more regularly both as a good incentive to publicise work I produce and to track my learning with time.

Because of this I plan to blog my progress on this project and will be open to any feedback. If you want to keep updated with my progress, I strongly recommend signing up to my mailing list on my blog [here](https://adamjhawley.com/post/2022-02-16-creating-a-link-sharing-site-part-0/#mailing-list). 

---

## Technology - How am I going to build this thing?
I have recently been picking up some experience using [lit](https://lit.dev/) and have found that it provides a very quick and easy way to get going with web components. This is about all the thinking I wanted to do at this point. Too often I get bogged down planning and deciding on frameworks, languages etc. This time I wouldn't let that happen. For better or for worse...

One thing I had heard of but not had the chance to use was the [Lit element JavaScript project template](https://github.com/lit/lit-element-starter-js). So this is going to act as the baseline for the project.

Here's the first element I created which is incredibly basic. `LinkBox` refers to a box or card containing the link someone has shared.

```{js}
import {LitElement, html} from 'lit';

/**
 * A small box containing a link and a title.
 */
export class LinkBox extends LitElement {

  static get properties() {
    return {
      /**
       * The title of the link.
       * @type {string}
       */
      name: {type: String},

      /**
       * The link itself.
       * @type {string}
       */
      link: {type: String},
    };
  }

  constructor() {
    super();
  }

  render() {
    return html`
      <a href=${this.link}><sl-button>${this.name}</sl-button></a>
    `;
  }
}

window.customElements.define('ls-link-box', LinkBox);
```

---

## Keep in Touch
For now, this is where I am. I aim to post roughly once a week with updates on my progress. I hope you enjoyed reading and wish me luck! As mentioned earlier, if you want to get updates straight to your inbox, consider following me or checking out the original article and joining my mailing list on my blog [here](https://adamjhawley.com/post/2022-02-16-creating-a-link-sharing-site-part-0/#mailing-list).

Happy hacking!