Bash
npm i geist
Cookie в Next
Как создавать и читать Cookie. Функции-обертки на TypeScript с удобной типизацией.
Что нового в Next 14
Next 14, выпущенный 26 октября 2023 года, ускоряет время сборки в 2 раза и добавляет несколько новых функций.
Типизация страницы в Next
Используй TypeScript и Next вместе, чтобы создать кастомный тип TNextPage, с помощью которого можно с легкостью указать типы params и searchParams на любой странице.
Шрифты в Next и Tailwind
Расскажу о любимом способе использовать шрифты на проектах с Next и Tailwind
Дизайнеры ▲ позиционируют Geist как решение для разработчиков и дизайнеров. И это было очень логично услышать с их стороны, потому что в их компании работают и программисты и дизайнеры, которые трудятся над большим количеством качественных проектов и преуспевают в этом. ▲ ценят не только за их подход к разработке API, но и за проработку дизайна своих продуктов, взять к примеру их официальный сайт...
...или страницу Next
Сначала ▲ занялись разработкой Mono версии шрифта, а после полировки ее до максимума задумались и о создании Sans версии, которая, по моему скромному мнению, изумительно будет смотреться на любом современном сайте.
В ▲ мы разработали Geist - шрифт, специально предназначенный для разработчиков и дизайнеров. Мы начали с создания моноширинной версии, в которой приоритет отдавался удобочитаемости и которая легко интегрировалась в среду программирования. Усовершенствовав моноширинный вариант, мы расширили Geist до версии Sans, добавив универсальности его возможностям. (Переведено)
— Vercel
▲ всесторонне нахваливают свой шрифт и вовсе не стесняются рекомендовать его.
Geist воплощает наши дизайнерские принципы простоты, минимализма и скорости, черпая вдохновение в известном швейцарском дизайнерском движении. Обладая точностью, ясностью и функциональностью, Geist улучшает визуальный опыт разработчиков и дизайнеров, позволяя им эффективно доносить свои идеи. (Переведено)
— Vercel
Судя по решительному и позитивному настрою ▲, они верят в успех Geist и в скором времени ожидают теплый прием со стороны сообщества. Я хоть и не умею читать чужие мысли, но скорее всего ▲ создавали этот шрифт как уверенный конкурент одному из самых известных веб шрифтов в мире - Inter. Сможет ли Geist занять твердую позицию в сообществе и словить волну хайпа? Невозможно сказать. Но одно понятно, точно - он выглядит не менее достойно, чем Inter.
Я говорю про Inter, потому что ▲ сами используют его во всех своих проектах. На момент публикации статьи, они все еще не интегрировали Geist повсеместно и некоторые их сайты, включая сайт Next, пока что сидят на Inter. Но я так понимаю, это всего лишь вопрос времени.
На странице Geist вы можете ознакомиться со всеми глифами, причем в таких подробностях, что вы буквально разглядваете SVG контуры этих глифов. Кому это надо? Кажется, ▲ явно любят выкладываться на максимум, особенно, когда дело доходит до шоукейсов 🤩.
▲ также прикладывают коллаж с дизайнами, чтобы у вас сложилось понимание, как этот шрифт может выглядеть в разных ситуациях. Спасибо им за это, наверное.
Ссылка на страницу Geist на npm на всякий случай.
npm i geist
Если вы работали/работаете с Next, то API вам знаком:
import { GeistSans } from 'geist/font'
export default function RootLayout({ children }) {
return (
<html lang='en' className={GeistSans.className}>
<body>{children}</body>
</html>
)
}
Можно скачать zip архив с их официального сайта, который включает в себя otf, woff2 и вариативный файлы. Архив удобно располагается на гитхабе. Далее можете использовать fontface
или любой другой способ заставить файл работать, это уже по вашему вкусу.
Использовать можно без ограничений. Лицензия OFL. Подробнее о лицензии здесь.
Если вам понравился этот шрифт, приятного пользования. Лично мне Inter немного приелся, но я не спешу переходить на Geist. Мой фаворит в текущий момент - Source Sans 3. Но кто знает, что будет завтра.
Все еще не можете определиться, нравится ли вам Geist? Посмотрите на Geist своими глазами.