Зачем вам вообще делать личный сайт/блог

Зачем вам вообще делать личный сайт/блог

Для тех из вас, кому интересно, мой личный сайт можно найти здесь.

Прежде чем мы перейдем к тому, как я создал свой личный веб-сайт и какие решения я принял, мы должны сначала понять, почему вы должны его создать. Создание личного веб-сайта/блога дает множество различных преимуществ, но я расскажу о двух главных причинах.

Отлично смотрится в резюме

Если вы похожи на меня и надеетесь, что вас наймут на стажировку/работу, личные веб-сайты — отличный личный проект, чтобы продемонстрировать свои навыки. Во многих компаниях существует множество различных процессов найма кандидатов. В некоторых из них инженеры/члены команды просматривают ваши резюме, в то время как в других их просматривают рекрутеры или сотрудники отдела кадров. Персональный веб-сайт — отличный способ обратиться к обеим группам, поскольку инженеры признают усилия и технологии, которые вы использовали для создания проекта, а персонал будет впечатлен его визуальным отображением.

Это отличный опыт обучения

На удивление, для создания личных веб-сайтов требуется множество различных технологий в зависимости от того, сколько вы хотите сделать вручную. Это особенно верно, если вы создаете блог вместе со своим веб-сайтом, поскольку тогда вам нужно подумать о CMS (система управления контентом). Количество усилий и количество материала, который вы хотите выучить, зависит только от вас. Существует так много бесплатных и дешевых технологий, которые упрощают некоторые аспекты создания веб-сайтов! Если вам не нравится работать с внешним интерфейсом, вы можете просто скачать несколько бесплатных шаблонов css. Если вы хотите сосредоточиться исключительно на SEO и создании контента, вам может подойти Jekyll. Если вы хотите использовать AWS для оптимизации вашего процесса, то AWS Amplify или AWS S3 будут очень полезны. Может быть, вы хотите сделать почти все с нуля и при этом использовать AWS, тогда AWS EC2 — ваш друг. Если вы не хотите тратить деньги, вам могут пригодиться такие сервисы, как страницы Heroku и Github. Как видите, существует множество технологий и различных аспектов разработки, на которых вы можете сосредоточиться!

Как я сделал свой личный сайт

Next.JS (по сравнению с Pure React.JS, по сравнению с Gatsby и с Jekyll)

Это основная структура, которую я использую. Next.JS — это фреймворк, построенный на основе популярного React.JS, и он упростил многие проблемы, которые у меня были с React.JS. Создание и навигация между страницами в Next.JS интуитивно понятны и просты. Вам даже не нужно слишком беспокоиться о Redux, хотя эта опция все еще доступна для вас. Моя претензия к React.JS заключалась в том, что для получения базовой функциональности требовалось слишком много шаблонного кода. Вы теряете очень мало гибкости, и эта гибкость, которую дает чистый React.JS, на самом деле не требуется для личного проекта, если только вы не пытаетесь сделать что-то очень сложное.

Это также одна из причин, по которой я предпочел Next.JS Gatsby. Для создания и навигации по различным страницам в Gatsby требовалось знание GraphQL, как и для большинства других функций в Gatsby. Хотя этот процесс разработки лучше, чем чистый React, шаблонов гораздо больше, чем Next.JS. В Next.JS все, что вам нужно сделать, это создать новый файл в папке страницы. Вот оно! Я также не самый большой поклонник GraphQL. Если вы любите GraphQL, я определенно рекомендую Gatsby.

Jekyll был еще одним фреймворком, который я изучил и отказался от него. Jekyll — самый уникальный из всех, поскольку он не основан на React. Jekyll в основном просто позволяет создавать статические страницы исключительно с помощью уценки и CSS. Это очень упрощенный процесс, который позволяет создавать красивые веб-сайты за считанные минуты, чтобы вы могли сосредоточиться исключительно на своем контенте. Проблема в том, что он слишком обтекаемый для меня. Если вы хотите быстро создать личный веб-сайт, который будет хорошо выглядеть, то это, безусловно, выбор для вас. Но лично я хотел иметь возможность показать немного больше своих технических способностей, если кто-то посмотрит на мой код. Я также узнал гораздо больше о разработке веб-сайтов с помощью Next.JS, чем с Jekyll.

Однако Next.JS не идеален. Есть некоторые компромиссы, которые вы должны сделать. Основной из них заключается в том, что Next.JS рендерится на стороне сервера. Он предназначен для размещения на сервере, в отличие от генераторов статических веб-сайтов, таких как Jekyll и Gatsby. Это означает, что вы не сможете использовать некоторые сервисы, такие как страницы Github или AWS S3, поскольку они поддерживают только статические веб-сайты. Вам нужно будет разместить свой веб-сайт на более сложном и потенциально более дорогом сервисе, таком как AWS Amplify, который я использую. Одним из преимуществ этого является то, что Next.JS имеет встроенную поддержку для оптимизации процесса создания API. Поэтому, если вы когда-нибудь захотите использовать свой личный веб-сайт в качестве хоста для вашего будущего проекта API, это легко и почти без проблем. Надеюсь, в будущем я смогу использовать эту гибкость для проекта по науке о данных.

TypeScript (против JavaScript)

Это был немного сложный выбор с моей стороны. Вы не потеряете гибкость или функциональность, если выберете одно вместо другого. TypeScript служит исключительно надмножеством JavaScript. TypeScript — это в основном lint, который не позволит вам скомпилировать, если вы не будете следовать ему. Для такого небольшого проекта, как личный веб-сайт, TypeScript может занять больше времени, чем принести пользу, поскольку требует гораздо большей настройки. При этом многие крупные компании используют возможности TypeScript, и переход с TypeScript на JavaScript, на мой взгляд, проще, чем переход с JavaScript на TypeScript. Я решил использовать TypeScript, потому что Next.JS имеет встроенную поддержку, а мне еще предстоит создать полноценный проект на TypeScript. Я бы солгал, если бы сказал, что TypeScript не увеличил время моей разработки, но я бы также солгал, если бы сказал, что мало чему научился.

AWS Amplify (по сравнению с Heroku по сравнению с AWS EC2)

Мой личный веб-сайт в настоящее время размещен на AWS Amplify, и есть много причин, по которым я сделал этот выбор. Прежде всего, поскольку я хотел использовать SSR (рендеринг на стороне сервера) Next.JS, это немедленно лишило меня возможности пользоваться услугами хостинга веб-сайтов, такими как AWS S3 и страницы Github, поскольку они поддерживали только статический веб-сайт. Поэтому мне пришлось искать службы хостинга веб-сайтов, поддерживающие Next.JS.

Heroku — это сервис, который я много раз использовал для своих личных проектов. Одним из самых больших преимуществ было то, что он был бесплатным и очень простым в использовании. Вы можете подключить свое приложение heroku к репозиторию github, и heroku будет развертываться всякий раз, когда вы отправляете свой код. Моей главной проблемой с Heroku было время загрузки. Если ваш веб-сайт не используется, Heroku переводит его в спящий режим, чтобы сэкономить на обработке. Проблема заключается в том, что если вы попытаетесь посетить свой веб-сайт, когда он спит, сначала загрузка займет несколько минут. Это может оттолкнуть некоторых работодателей, которые впервые попытаются посетить ваш сайт, особенно во время собеседования. Это также ужасно для SEO. Одной из характеристик, которую Google использует для оценки того, насколько высоко они должны ранжировать ваш сайт в результатах поиска, является скорость загрузки. Чем быстрее загружается ваш сайт, тем выше его ранжирует Google. Это особенно вредно, если вы хотите прикрепить блог к ​​своему сайту, поскольку хорошее SEO — это один из способов обнаружить ваш блог.

На другом конце спектра находится AWS EC2. По сути, это базовый сервер, предоставленный вам Amazon. Если вам нужен более мощный сервер, вам лучше быть готовым выложить большие деньги, но, к счастью, у AWS EC2 (как и у многих других продуктов на Amazon) есть бесплатный уровень. Здесь вы можете использовать очень простой одноядерный сервер практически бесплатно. Причина, по которой я не решил пойти по этому пути, заключалась в том, что было слишком много дел. Все будет зависеть от меня, чтобы справиться. Используя nginx, управляя учетными данными, SSL и обрабатывая запросы, я отвечаю за то, чтобы все работало. Несмотря на то, что это отличный проект и потрясающая возможность обучения, он требует больше усилий и времени, чем у меня есть. Я также не хочу полагаться на свои навыки, чтобы поддерживать свой блог, когда группа очень способных разработчиков уже решила все мои проблемы в другом сервисе Amazon. Это также гарантирует, что у меня будет сервер AWS EC2 бесплатного уровня для моего будущего проекта. С простым и гибким сервером AWS EC2 я могу использовать его для запуска сценариев, которые я не хочу запускать на своем персональном компьютере. Например, обучение большой нейронной сети может потребовать бесчисленных часов вычислительной мощности. Вместо того, чтобы использовать свой собственный компьютер, я могу запустить скрипт на сервере и проверить его через несколько дней. Есть также некоторые API, которые ограничивают скорость запросов. Я могу запускать эти сценарии на сервере до тех пор, пока не сделаю все необходимые запросы. Подводя итог, можно сказать, что хотя AWS EC2 очень мощен, он может быть излишним для личного веб-сайта и может быть лучше использован для более интенсивного проекта.

К счастью, есть сервис, который дает вам лучшее из обоих миров. AWS Amplify — это сервис, созданный для запуска полнофункциональных приложений. Он имеет интеграцию с github, как Heroku, и знакомит вас с экосистемой AWS. Это особенно полезно, если вы хотите или уже зарегистрировали Amazon и управляете всеми своими доменами. AWS Amplify также легко взаимодействует с другими сервисами AWS, поэтому, если вы когда-нибудь захотите использовать такие вещи, как DynamoDB, вы можете легко добавить их в свое приложение. Вы также можете указать AWS в своем резюме, если чувствуете себя уверенно! AWS Amplify также предоставляется на уровне бесплатного пользования и взимает плату за время сборки и объем обслуживаемой памяти. Хотя это может показаться пугающим, но если ваш сайт посещают не слишком часто, вы можете легко рассчитывать на комиссию менее 2 долларов в месяц. Вы также получаете надежность серверов Amazon на своей стороне.

Markdown (и другие CMS)

Последнее, что вы хотите изучить, если хотите создать блог, это то, как вы собираетесь публиковать и хранить эти блоги на своем веб-сайте. Здесь в игру вступают CMS (системы управления контентом). CMS — это фактически процесс или система, которую вы используете для создания своих блогов. Я очень сомневаюсь, что вы хотите кодировать новую страницу для каждого сообщения в блоге, которое вы хотите сделать. Интуитивно, когда вы это сделаете, будет много повторяющегося кода. Вы можете создать свою собственную CMS с нуля, и если вы это сделаете, у вас будет больше возможностей, но, как я показал выше, как и в большинстве случаев, кто-то, вероятно, уже сделал сервис, который упрощает это. Если нет, то для вас есть бизнес-идея!

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

Для создания этих блогов я использую уценку вместе с отмеченным пакетом npm. Помеченный пакет — это очень мощный пакет, который превращает уценку в html. Все, что мне нужно сделать, это создать файл уценки, написать туда свой блог, и мой веб-сайт программно создаст страницу и html через Next.JS и пометит! Функциональность оказалась на удивление простой, и, поскольку мой блог написан с использованием уценки, я могу легко разместить этот блог на других веб-сайтах, таких как Medium, по причинам SEO.

Краткое содержание

В заключение, личные веб-сайты/блоги — отличная возможность сэкономить время, особенно если вы хотите продемонстрировать свои навыки будущим работодателям и друзьям. Next.JS, AWS Amplify и уценка — это именно то, что мне было нужно для быстрого и эффективного создания моего веб-сайта. Лично для меня это идеальное сочетание гибкости и надежности. Этот стек технологий был одним из самых простых и эффективных, с которыми я когда-либо работал.

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