@konkin

Устанавливаем CocoaPods и Realm

2023-08-17T23:37:44.989Z

Это руководство по установке CocoaPods и Realm я написал в большей степени для себя, как заметку! Но, если эта статья кому-то пригодится, то я буду только рад. (-:

Итак, начнем!
Сначала краткое пояснение о том …

… что такое CocoaPods?

CocoaPods — это мощное и одновременно изящное средство управления зависимостями Cocoa-библиотек, которые разработчики используют в своих iOS и macOS проектах.

… что такое Realm?

Realm — это кроссплатформенная мобильная база данных для iOS (Swift, Objective-C) и Android. Realm построен чтобы быть лучше и быстрее, чем SQLite и Core Data. Она не просто лучше и быстрее, она легка в использовании, и Вы сможете делать много вещей используя всего несколько строк кода.

Установка CocoaPods

Для установки CocoaPods открой Терминал и введи следующую строку:

$ sudo gem install cocoapods //актуальная версия cocoapods
$ sudo gem install cocoapods --pre //тестовая версия

Если у тебя уже установлен CocoaPods, то возможно его надо обновить. В Терминале введи эти строки

$ gem list --local | grep cocoapods //узнать установленную версию

$ pod repo update //обновить cocoapods

Вот и всё! CocoaPods установлен/обновлен. CocoaPods Guides.

Чтобы удалить CocoaPods (удаляет все версии):

$ gem list --local | grep cocoapods //узнать установленную версию

Удаляем CocoaPods

$ sudo gem uninstall cocoapods
$ sudo gem uninstall cocoapods-core
$ sudo gem uninstall cocoapods-downloader

Удалить старый основной репозиторий:

$ sudo rm -fr ~/.cocoapods/repos/master

Список часто используемых команд терминала:

$ help // список команд

$ help имя_команды // cправка по конкретной команде

$ cd // перейти в папку выше

$ cd .. // перескочить в “родную” папку, обычно это /users/имя_пользователя

$ cd / // перейти в корневую папку диска

$ cd ~ // прямой переход в основную папку 
// пользователя /users/имя_пользователя

$ cd ~/Documents // перейти в папку документы принадлежащую текущему 
// пользователю. Таким образом, можно переходить и в другие 
// папки пользователя 

$ cd Documents/region/ // переход в папку Documents/region/

$ cd /pictures // попытка перехода в директорию pictures расположенную 
// в КОРНЕВОЙ папке диска

$ cd pictures // попытка перехода в папку pictures в текущей папке

$ cd ‘Имя папки’ и cd Имя\ папки // имя папки с “пробелом” должно быть 
// заключено в одинарные кавычки или должен быть обратный 
// слэш перед пробелом

$ pwd // она показывает, где вы сейчас находитесь (print working directory)

Установка Realm с помощью CocoaPods

Для начала, тебе необходимо создать в Xcode новый проект “Single View Application” и назвать его, например “region” или как нравиться.

Теперь закроем Xcode.

Потом переходим к папке нашего созданного проекта region, для этого вводим в Терминале (у меня проект лежит в папке Documents/XcodeProjects/region/):

$ cd Documents/XcodeProjects/region/

убедиться что ты сделал всё верно, можно командой

$ pwd //покажет текущую папку

Применение:

$ pod COMMAND

CocoaPods, менеджер пакетов библиотеки Cocoa.

Команды:

+ cache         Управление кешем CocoaPods
+ deintegrate   Деинтегрировать CocoaPods из вашего проекта
+ env           Display pod environment
+ init          Создайте Podfile для текущего каталога
+ install       Установите зависимости проекта в соответствии с версиями из Podfile.lock
+ ipc           Inter-process communication
+ lib           Develop pods
+ list          List pods
+ outdated      Показать устаревшие зависимости проекта
+ plugins       Показать доступные плагины CocoaPods
+ repo          Manage spec-repositories
+ search        Поиск pods
+ setup         Настройте среду CocoaPods
+ spec          Управление pod specs
+ trunk         Взаимодействие с CocoaPods API (например, публикация новых specs)
+ try           Try a Pod!
+ update        Обновите устаревшие зависимости проекта и создайте новый Podfile.lock

Параметры:

--allow-root    Позволяет CocoaPods работать от имени root
--silent        ничего не показывать
--version       Показать версию tool
--verbose       Показать больше информации об отладке
--no-ansi       Показать вывод без кодов ANSI
--help          Показать справку указанной команды

далее, инициализируем Cocoapods

$ pod init

в некоторых случаях когда Podfile не создается, нужно применить следующую команду к директории проекта

$ sudo gem update xcodeproj

а потом повторить

$ pod init

Далее, когда Podfile создался, прописываем в нем необходимые фреймворки для установки в проект, в нашем случае мы устанавливаем Realm, поэтому добавляем строку pod 'RealmSwift', '~>10'

platform :ios, '12.0'

target 'region' do
# Comment the next line if you don't want to use dynamic frameworks
  use_frameworks!

# Pods for region
  pod 'RealmSwift', '~>10'

end

Потом вводим команду в Терминале, и ждем установки Realm

$ pod install

По завершении в папке проекта появятся новые файлы:

Pods (папка)
Podfile.lock
region.xcworkspace

С этого момента для работы с проектом Вам нужно будет открывать файл region.xcworkspace

Полезные ссылки

GitHub Realm Swift -> https://github.com/realm/realm-swift

Документация -> https://www.mongodb.com/docs/realm/sdk/swift/

GitHub Realm Studio -> https://github.com/realm/realm-studio

Скачать Realm Studio MacOS -> https://studio-releases.realm.io/latest/download/mac-dmg

Настройка VSCode для web-разработки

2022-10-29T20:42:53.361Z

Для начала нам нужно скачать и установить редактор кода Visual Studio Code (VSCode) https://code.visualstudio.com, если у вас он ещё не установлен.

Начнем с того, что нам нужно создать где-нибудь (обычно это папка где вы храните все ваши проекты) папку проекта и назвать например 'web', открыть VSCode и перетащить эту папку в Explorer (Проводник в боковой панеле программы).

VSCode Explorer

Далее создать там все необходимые папки и файлы для программирования сайта, например как на изображение выше.

Папка src это папка где будет проходить вся основная работа над сайтом, в ней будут храниться все исходные файлы. Папка dist это папка куда мы впоследствии будем в автоматическом режиме (с помощью Gulp — набор инструментов для автоматизации) копировать/компилировать только файлы, которые нужны для работы сайта и ничего лишнего.

Теперь нам нужно скачать и установить Node.js® (кроссплатформенная среда выполнения JavaScript) https://nodejs.org/en/. Теперь мы имеем npm — менеджер пакетов, входящий в состав Node.js

Для начала мы убедимся/проверим установку node, npm и npx, для этого в терминале в VSCode вводим такие команды

node --version

npm --version

npx --version

Терминал VSCode

После создаем файл с настройками пакетов, вводим следующую команду

npm init

Мыполучаем сообщение, см. изображение ниже

Терминал VSCode

Здесь у нас запрашивается информация о проекте.

В строке package name: (web) нужно указать имя проекта и т.д.. Мы же просто жмём Enter на всех запросах, так как эту информацию можно внести/изменить позже и отвечаем y на вопрос Is this OK? (yes). См. изображение ниже

Терминал VSCode

И так у нас создался новый файл package.json, см. изображение ниже

VSCode

Здесь как мы видим находится инфа которая у нас запрашивалась, и здесь можно изменять/добавлять информацию о проекте. Но сейчас в этом файле мы будем указывать какие пакеты (packages) мы будем использовать для работы над нашим сайтом.

Далее установим утилиту командной строки Gulp, в терминале введите строки указанные ниже, после ввода терминал у вас запросит пароль пользователя, вводим его для подтверждения, флажок -g говорит о глобальной установке, если вы ранее уже вводили эту команду, то сейчас уже не надо, переходите далее к локальной установке

sudo npm install gulp-cli -g

теперь устанавливаем Gulp пакет непосредственно в наш проект, локально, об этом говорит нам флажок --save-dev

sudo npm install gulp-cli --save-dev

sudo npm install gulp --save-dev

У нас добавились папки/файлы node_modules и package-lock.json, а в файле package.json добавились строки, см. изображение ниже

Теперь проверим установленную версию

gulp --version

Итак Gulp пакет мы успешно установили, а теперь перейдем на сайт-ресурс с множеством плагинов для разных нужд https://www.npmjs.com/package/packages

В строке поиска можно находить то что вам нужно, а конкретно сейчас Gulp Sass https://www.npmjs.com/package/gulp-sass, перейдя по ссылке, на странице плагина подробно всё написано как установить, как использовать, примеры кода и т.д., вводим команду ниже, не забывайте добавлять --save-dev

npm i sass gulp-sass --save-dev

Теперь в devDependencies должна появиться строка "gulp-sass": "^5.1.0"

Вот список плагинов которые обычно устанавливаются для работы в VSCode над сайтом

browsersync https://www.npmjs.com/package/browser-sync
документация https://browsersync.io/docs/gulp
команда установки плагина npm i browser-sync --save-dev
gulp-sass https://www.npmjs.com/package/gulp-sass
команда установки плагина npm i sass gulp-sass --save-dev
gulp-autoprefixer https://www.npmjs.com/package/gulp-autoprefixer
команда установки плагина npm i gulp-autoprefixer --save-dev
gulp-clean-css https://www.npmjs.com/package/gulp-clean-css
команда установки плагина npm i gulp-clean-css --save-dev
gulp-rename https://www.npmjs.com/package/gulp-rename
команда установки плагина npm i gulp-rename --save-dev
gulp-imagemin https://www.npmjs.com/package/gulp-imagemin
команда установки плагина npm i gulp-imagemin@7.1.0 --save-dev
gulp-htmlmin https://www.npmjs.com/package/gulp-htmlmin
команда установки плагина npm i gulp-htmlmin --save-dev

После установки плагинов

Переходим к настройке Gulp. Создаем файл gulpfile.js .

Открываем его и начинаем писать javascript код. Начнем с главного, а это browsersync https://browsersync.io/docs/gulp, ну и все остальные плагины. См. изображение ниже, какой код должен у вас получиться, получился не маленький)

Настройки каждого плагина можно найти на его странице на сайте https://www.npmjs.com/package/plugins или же просто переписать js код который показан выше.

Если вы всё сделали правильно, то в терминале запускаем Gulp командой gulp + enter, у вас должна открыться страница сайта по пути ../dist/index.html с адресом http://localhost:3000, теперь каждое изменение в файлах таких как scss, js, html и т.д. будет отслеживаться и страница сайта в браузере будет обновляться автоматически.

Чтобы остановить Gulp, в терминале жмем комбинацию клавиш Control + C.

Ну в принципе почти всё! Удачи с кодингом.

Полезная ссылка по настройке gulpfile.js

#vscode

#web

#coding

#coder

#settings

Web ништяки (обновляемое)

2022-10-25T15:54:59.127Z

Относительные единицы измерения CSS

em -> высота шрифта текущего элемента
rem -> высота шрифта базового значения
ex -> высота символа x
px -> пиксель
% -> процент
in -> дюйм (1 дюйм равен 2,54 см)
cm -> сантиметр
mm -> миллиметр
pt -> пункт (1 пункт равен 1/72 дюйма)
pc -> пика (1 пика равна 12 пунктам)
vh -> высота вьюпорта (окна браузера)
vw -> ширина вьюпорта (окна браузера)
vmin -> размер в процентах от меньшей размерности вьюпорта. Если высота меньше ширины (например, горизонтальная ориентация телефона), то расчёт будет вестись относительно высоты.
vmax -> размер в процентах от большей размерности вьюпорта. Если высота больше ширины (например, нормальная ориентация телефона), то расчёт будет вестись относительно высоты.

Разговор о единице измерения em и rem

За единицу измерения em и rem берут базовое значение размера шрифта, обычно это — 16 px. Но также его можно изменить, если задать свой базовый размер шрифта для всего сайта

html { font-size: 10px; }

rem будет всегда брать за единицу этот размер, em же будет менять свою единицу, он будет наследовать размер его родительского блока, например:

style.css html { font-size: 10px; } .block { font-size: 1.5rem; } .example1 { font-size: 2rem; } .example2 { font-size: 2em; } index.html html { <div class="block"> здесь будет 15px, 10px умножить на 1.5rem <p class="example1">Test 1</p> здесь будет 20px, 10px умножить на 2rem <p class="example2">Test 2</p> здесь будет 30px, тк у род. блока размер 15px умножаем на 2em </div> }

Кстати, для простоты расчетов, можно задать базовый размер шрифта 10px, тогда 14px будет 1.4em или rem, как угодно.

Немного кода

CSS

[class^="box-"] { background-color: skyblue; /* Размещаем контейнеры по центру */ display: grid; place-items: center; }

Сброс стилей normalize.css

Современная, готовая к HTML5 альтернатива сбросу CSS. Normalize.css заставляет браузеры отображать все элементы более последовательно и в соответствии с современными стандартами. Он точно нацелен только на стили, которые нуждаются в нормализации.

Установить через менеджер пакетов -> npm install normalize.css смотрите Node.js в полезных ссылках

Скачать -> http://necolas.github.io/normalize.css/

Назначить удаленно отсюда -> https://cdn.jsdelivr.net/npm/normalize.css@8.0.1/normalize.min.css

Полезные ссылки

Learn Code -> https://www.w3schools.com

HTML5CSS -> https://html5css.ru

Справочник HTML -> http://htmlbook.ru/html

Справочник CSS -> https://webref.ru/css

Справочник HTML -> https://webref.ru/html

CSS3 медиа-запросы ->https://webref.ru/css/value/media и http://htmlbook.ru/css/value/media

CSS3 селекторы -> https://learn.javascript.ru/css-selectors

CSS3 Reference -> https://cssreference.io

Методология БЭМ создана в Яндексе для разработки сайтов, которые надо делать быстро,а поддерживать долгие годы. Она позволяет создавать расширяемые и повторно используемые компоненты интерфейса. -> https://ru.bem.info/methodology/

Can I use... Поддержка таблиц для HTML5, CSS3 и т. д. -> https://caniuse.com/

Что такое Flexbox? -> https://html5.by/blog/flexbox/

№1 Современный и простой генератор веб-шрифтов css @font-face -> https://transfonter.org

№2 Генератор веб-шрифтов -> https://www.fontsquirrel.com/tools/webfont-generator

Node.js® кроссплатформенная среда выполнения JavaScript с открытым исходным кодом -> https://nodejs.org/en/

Gulp набор инструментов для автоматизации и улучшения вашего рабочего
процесса -> https://gulpjs.com

npm сайт-ресурс плагинов -> https://www.npmjs.com/package/plugins

jQuery Validation: Проверяйте формы так, как никогда раньше -> https://jqueryvalidation.org/documentation/

React Hook Form Validation. Эффективные, гибкие и расширяемые формы с простой в использовании проверкой. -> https://react-hook-form.com

JavaScript маска ввода разных данных (дата, номер телефона и т.д.) -> https://imask.js.org

Just-add-water CSS animations -> https://animate.style

W3C Markup Validation Service -> https://validator.w3.org

Скорость загрузки сайта -> https://pagespeed.web.dev

Генератор метатегов -> https://metatags.io

#1 Генератор фавиконок -> https://realfavicongenerator.net

#2 Генератор фавиконок -> https://www.favicon-generator.org

JSHint Options -> https://jshint.com/docs/options/

Что делать, если Mac начал тормозить?

2022-10-23T19:38:03.289Z

Быстродействие компьютера далеко не всегда зависит от мощности его аппаратной начинки, особенно, если говорить про Mac. Высокий уровень оптимизации «харда» и «софта» обеспечивает компьютерам Apple возможность исправно работать на относительно слабом железе, месяцами не требуя перезагрузки. Но иногда Mac начинают страдать от потери скорости при выполнении даже не слишком ресурсоемких задач. Как правило, это проблема проистекает из загруженности оперативной памяти, которой требуется сброс.

Как очистить оперативную память на Mac?

Первое, что следует предпринять в таких ситуациях, — эта банальная перезагрузка. Поскольку оперативная память является энергозависимой, а значит, прекращает выполнение и поддержание работы всех запущенных задач при отключении питания. Иными словами, таким образом мы сбрасываем кэшированные данные и снижаем нагрузку на оперативную память. Этот способ, вопреки своей простоте, оказывается достаточно действенным, но есть и более эффективные решения, чтобы сбросить ОЗУ.

Другой способ, о котором идет речь, предполагает минимальные навыки работы с Terminal. Просто следуйте инструкции ниже:

Запустите Terminal на своем Mac. Как правило, он хранится в папке «Другие» в LaunchPad;
Введите в строке Terminal команду sudo purge;
Если потребуется, подтвердите действие вводом пароля, который вы используете для авторизации в своем Mac.

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

Не переживайте, это действие абсолютно безопасно для вашего Mac и не может ему навредить. А поскольку очищается только оперативная память, ни один важный файл не пропадет.

#mac

#terminal

Источник https://appleinsider.ru/tips-tricks/kak-ochistit-operativnuyu-pamyat-na-mac.html