Присоединяйтесь ко мне, когда я приступаю к созданию независимого от домена сайта для обмена ссылками.

Введение

Добро пожаловать в новую серию статей блога. В этой серии я буду делиться своим прогрессом в новом проекте. Что за новый проект? Я хочу создать сайт обмена ссылками, похожий на HackerNews, но с гибкостью StackExchange. Читайте дальше, чтобы узнать больше.

Мотивация — Почему я это делаю?

Как заядлый читатель HackerNews однажды я начал задаваться вопросом, существуют ли такие сайты в других доменах. Я знал, что агрегаторы популярны в таких областях, как поиск новой музыки, но они, как правило, более сложны.

Что мне нравится в HackerNews, так это органический рост различных ссылок. Когда ссылка размещается на сайте, она не окружена каким-то длинным описанием или предысторией. Только название страницы. Это означает, что качество ссылки оценивается читателями на основе содержания, а не того, насколько хорошо автор может украсить страницу вводящим в заблуждение или преувеличенным описанием.

Как разработчик я также провожу много времени на другом сайте, StackOverflow или, в более общем смысле, StackExchange. Одна интересная вещь, которую я нахожу в StackExchange, — это то, как он взял концепцию, которая работает в отдельных доменах, и реализовал ее в них по отдельности. Например, помимо StackOverflow для программирования, есть также english.stackexchange.com и mathematics.stackexchange.com для английского и математики соответственно. Полный список смотрите здесь: https://stackexchange.com/sites.

Учитывая эти два сайта, на которые я провожу очень много времени, я подумал, что попытаюсь создать сеть сайтов обмена ссылками в разных доменах.

Показываю мою работу

Недавно я дочитал Покажи свою работу! Остина Клеона (очень рекомендую)! В дополнение к этому я недавно прослушал отличный подкаст Indie Hackers с Джошем Пигфордом. И то, и другое вдохновило меня на то, чтобы выработать привычку делиться своей работой. Сам мой блог все еще находится в зачаточном состоянии, и я пытаюсь выработать привычку публиковать сообщения более регулярно, что является хорошим стимулом для публикации результатов моей работы и для отслеживания моего обучения со временем.

Из-за этого я планирую вести блог о своем прогрессе в этом проекте и буду открыт для любых отзывов. Если вы хотите быть в курсе моих успехов, я настоятельно рекомендую подписаться на мою рассылку в моем блоге здесь.

Технология — Как я собираюсь построить эту штуку?

Недавно я приобрел некоторый опыт использования lit и обнаружил, что он обеспечивает очень быстрый и простой способ начать работу с веб-компонентами. Вот и все мысли, которые я хотел сделать в этот момент. Слишком часто я увязаю в планировании и выборе фреймворков, языков и т. д. На этот раз я бы этого не допустил. Лучше или хуже…

Одна вещь, о которой я слышал, но не имел возможности использовать, это Шаблон проекта JavaScript с подсветкой. Так что это будет основой для проекта.

Вот первый созданный мной элемент, который невероятно прост. LinkBox относится к ящику или карточке, содержащей ссылку, которой кто-то поделился.

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);

Поддерживать связь

На данный момент я здесь. Я стараюсь публиковать сообщения примерно раз в неделю с обновлениями о моем прогрессе. Надеюсь, вам понравилось читать и желаю удачи! Как упоминалось ранее, если вы хотите получать обновления прямо на свой почтовый ящик, подпишитесь на меня или ознакомьтесь с оригинальной статьей и присоединитесь к моему списку рассылки в моем блоге здесь.

Удачного взлома!