Шаг 1: Создание аккаунта на GitHub
1
Зарегистрируйтесь на GitHub
Перейдите на сайт github.com и создайте бесплатный аккаунт.
2
Создайте репозиторий
Нажмите кнопку "New" (Создать) и укажите:
- Repository name: название вашего проекта (например,
photo-editor) - Description: краткое описание
- Public: публичный доступ (рекомендуется)
- Add a README file: да (обязательно)
Шаг 2: Подготовка файлов
3
Организуйте структуру папок
Создайте папку для вашего проекта и поместите туда все файлы:
ваш-проект/
├── index.html
├── assets/
│ ├── images/
│ ├── css/
│ └── js/
├── README.md
└── .gitignore
Совет: Создайте файл
README.md с описанием вашего проекта. Это важно для других разработчиков.
Шаг 3: Установка Git
4
Скачайте и установите Git
Перейдите на сайт git-scm.com и установите Git на свой компьютер.
Шаг 4: Загрузка на GitHub
5
Откройте терминал/командную строку
Перейдите в папку с вашим проектом:
$
cd путь/к/вашему/проекту
6
Инициализируйте репозиторий
Выполните команды в терминале:
$
git init
$
git add .
$
git commit -m "Первая версия проекта"
7
Свяжите с GitHub и загрузите
Замените URL на адрес вашего репозитория:
$
git remote add origin https://github.com/ваш-логин/название-репозитория.git
$
git branch -M main
$
git push -u origin main
Альтернативный способ: Через браузер
8
Загрузка без командной строки
Можно загружать файлы прямо через веб-интерфейс GitHub:
- Откройте свой репозиторий на GitHub
- Нажмите кнопку "Add file" → "Upload files"
- Перетащите файлы из папки проекта
- Нажмите "Commit changes"
Важно: Не загружайте конфиденциальные данные (пароли, ключи API) в публичные репозитории!
Пример для вашего фото-редактора
Если у вас есть фото-редактор на базе Pixie, вот как может выглядеть структура:
photo-editor/
├── index.html
├── assets/
│ ├── pixie.js
│ ├── pixie.css
│ └── images/
├── js/
│ └── custom-editor.js
├── README.md
└── .gitignore
Полезные советы
Регулярные коммиты: Делайте коммиты после каждого важного изменения с понятными сообщениями.
Файл .gitignore: Создайте этот файл, чтобы Git не отслеживал ненужные файлы (временные файлы, кэш и т.д.).
Документация: В файле README.md укажите, как запустить ваш проект и его функции.
Удачи с вашим проектом! 🎉
Теперь ваш код будет в безопасности и доступен отовсюду.