React projects for beginners

React Project для репозитория начинающих

Добро пожаловать в проект React для репозитория начинающих! Это особое место для начинающих, увлеченных обучением и участия в реагировании на проекты JS с открытым исходным кодом. (85 ++ проекты)

ПРИМЕЧАНИЕ № 1: Пожалуйста, внимательно проверьте свой проект, он должен быть без ошибок, ваш проект будет рассмотрен, если рецензент найдет любую ошибку, которую ваш запрос помечен как «недействительный».

Примечание № 2: Не забудьте перечислить свой проект в файле `projects.js` в корневой папке репо. Вы также можете добавить демонстрационную ссылку вашего проекта (если есть)

ПРИМЕЧАНИЕ № 3: Пожалуйста, прочитайте Руководство по управлению репо.

Описание

Этот репозиторий служит платформой для проекта React для начинающих участников, которые находятся в своем пути к освоению React JS и хотят внести свой вклад в Hacktoberfest. Это место, где вы можете поделиться своими мини-проектами, учиться у других и способствовать росту сообщества с открытым исходным кодом.

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

Что такое Hacktoberfest?

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

Процесс вклада

1. Вилка : разветвляется это репозиторием GitHub в вашу собственную учетную запись GitHub 2. Клон : клонировать разборку репо (репо, присутствующий на вашей учетной записи) на вашу локальную машину (напоминание: убедитесь, что вы находитесь в каталоге, где вы хотите хранить хранилище).

 git clone https://github.com/ianshulx/React-projects-for-beginners

3. Создайте новую филиал

git checkout -b my-new-branch

4. Изменения : создайте новую филиал и совершите свои изменения в этой филиале. 5. Добавить и совершить

• Добавьте свои изменения

git add .

• Совершить свои изменения. (Напоминание: убедитесь, что ваше соответствующее сообщение включает в себя необходимые детали, чтобы понять изменения (ы))

git commit -m "Relevant message"

6. Push : после всех изменений вступит изменения, вставьте свои изменения в ваше удаленное репо.

git push origin my-new-branch

7. PR : После продвижения изменений поднимите пиар из вашего удаленного репо до филиала Dev Repo (напоминание: убедитесь, что вы соответствуете своему пиарщику, чтобы понять основную тему вашего запроса)

Участвуя в этом репозитории, вы не только внесете свой вклад в открытый исходный код, но и улучшаете свои навыки в React JS. Давайте сделаем обучение реагировать весело и интерактивно во время этого Hacktoberfest! Счастливого кодирования и счастливого хактоберфеста!

Руководящие принципы вклада

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

Найдите полный список руководящих принципов в файле Anforming.md.

Руководство по управлению репо

Этот репозиторий проводит несколько проектов, и для обеспечения плавного производительности и эффективного управления необходимо соблюдать следующие руководящие принципы:

1. Ограничение размера проекта

• Каждая отдельная папка проекта не должна превышать 15 МБ .
• Если проект требует большего места из -за дополнительных активов или данных, рассмотрите возможность рефакторирования кода или хранения внешних файлов в отдельном месте (например, облачное хранилище или страницы GitHub).

2. Файл Организация

• Проекты должны быть организованы в четко обозначенных папках под корневым каталогом.
• Сохранить структуру папки простой, например, Project_name1/ , Project_name2/ и т. Д.

3. Избегайте больших двоичных файлов

• Не проводите большие двоичные файлы (например, видео, изображения с высоким разрешением, скомпилированные исполняемые файлы) непосредственно в репозиторий.
• Используйте GIT LFS (большое хранилище файлов) для файлов более 100 МБ или рассмотрите возможность хранения больших активов за пределами репозитория и ссылки на них.

4. минимизировать внешние библиотеки

• Минимизировать использование тяжелых сторонних библиотек или внешних зависимостей.
• Используйте файл .gitignore , чтобы исключить ненужные или автогенерируемые файлы (например, node_modules/ , build/ и т. Д.).

5. Регулярная очистка

• Выполните регулярную очистку ненужных файлов (например, журналы, временные файлы).
• Удалите устаревший или неиспользованный код, активы или проекты из репозитория.

6. Сжатие активов

• Сжатие изображения : используйте такие инструменты, как Tinypng, ImageOptim или Squoosh для сжатия изображений (PNG, JPEG и т. Д.), Прежде чем их совершить.
  • Для веб -изображений : используйте соответствующие форматы, такие как WebP , чтобы значительно уменьшить размер без качества.
• Ограниченное разрешение : избегайте использования изображений с высоким разрешением без необходимости. Для большинства проектов реагирования разрешения 72 DPI (точки на дюйм) достаточно для Интернета.
• Использование SVG : используйте файлы SVG , когда это возможно для векторной графики, поскольку они масштабируемые и легкие.
• Сжатие других активов, таких как PDF -файлы и аудиофайлы, используя инструменты сжатия без потерь, прежде чем добавлять их в репозиторий, чтобы уменьшить размер файла.

7. Оптимизировать код для производительности

• Перепредит и Minify : убедитесь, что настройка проекта использует такие инструменты, как WebPack или Vite, для объединения и министерства файлов JavaScript и CSS. Это уменьшает размеры файлов и ускоряет время загрузки.
• Встряхивание дерева : при использовании сторонних библиотек, убедитесь, что импортируйте только необходимые детали (погашение деревьев), чтобы избежать неиспользованного кода.
  • Например, предпочитайте import { Button } from 'library' вместо import * as Library from 'library' .

8. Управление версиями и управлением истории

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

9. Вклад

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

Нормы поведения

Этот проект придерживается значений Hacktoberfest ↗ и кодекса поведения участника ↗. Участвуя, вы должны поддержать этот кодекс. В Addtiona этот проект

Лицензия

Этот репозиторий лицензирован по лицензии MIT.

Лицензия MIT делает резюме и Dont:

Do's's: Используйте код в коммерческих приложениях: например, компания может создать фирменную часть программного обеспечения, которое включает в себя все или часть оригинального открытого исходного кода, а затем взимать деньги за это программное обеспечение. Измените код: другими словами, разработчики могут изменить/обновить код, как им это хотелось. Распределите копии кода и любые модификации: до тех пор, пока исходное уведомление об авторском праве и сама лицензия включена, организация может распространять и продавать копии или модифицированные версии кода. Сублиценс код: это означает, что вы можете включить исходный код в модификацию с более строгой лицензией.

Don't's: не может привлечь к ответственности автора кода юридической ответственности. Не удается удалить уведомление об авторском праве и оригинальную лицензию из вашей версии кода.

Давайте начнем вносить свой вклад и сделаем сообщество с открытым исходным кодом лучше для всех!

React Project для репозитория начинающих

Добро пожаловать в проект React для репозитория начинающих! Это особое место для начинающих, которые увлечены обучением и участвуют в проектах с открытым исходным кодом с использованием React JS. В настоящее время его Hacktoberfest!

ПРИМЕЧАНИЕ № 1: Пожалуйста, внимательно проверьте свой проект, он должен быть без ошибок, ваш проект будет рассмотрен, если рецензент найдет любую ошибку, которую ваш запрос помечен как «недействительный».

Примечание № 2: Не забудьте перечислить свой проект в файле `projects.js` в корневой папке репо. Вы также можете добавить демонстрационную ссылку вашего проекта (если есть)

ПРИМЕЧАНИЕ № 3: Пожалуйста, прочтите [Руководство по управлению репозиции] (https://github.com/ianshulx/react-projects-for-beginners/blob/main/repo_size_guidelines)

Описание

Этот репозиторий служит платформой для проекта React для начинающих участников, которые находятся в своем пути к освоению React JS и хотят внести свой вклад в Hacktoberfest. Это место, где вы можете поделиться своими мини-проектами, учиться у других и способствовать росту сообщества с открытым исходным кодом.

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

Что такое Hacktoberfest?

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

Процесс вклада

1. Вилка : разветвляется это репозиторием GitHub в вашу собственную учетную запись GitHub 2. Клон : клонировать разборку репо (репо, присутствующий на вашей учетной записи) на вашу локальную машину (напоминание: убедитесь, что вы находитесь в каталоге, где вы хотите хранить хранилище).

 git clone https://github.com/ianshulx/React-projects-for-beginners

3. Создайте новую филиал

git checkout -b my-new-branch

4. Изменения : создайте новую филиал и совершите свои изменения в этой филиале. 5. Добавить и совершить

• Добавьте свои изменения

git add .

• Совершить свои изменения. (Напоминание: убедитесь, что ваше соответствующее сообщение включает в себя необходимые детали, чтобы понять изменения (ы))

git commit -m "Relevant message"

6. Push : после всех изменений вступит изменения, вставьте свои изменения в ваше удаленное репо.

git push origin my-new-branch

7. PR : После продвижения изменений поднимите пиар из вашего удаленного репо до филиала Dev Repo (напоминание: убедитесь, что вы соответствуете своему пиарщику, чтобы понять основную тему вашего запроса)

Участвуя в этом репозитории, вы не только внесете свой вклад в открытый исходный код, но и улучшаете свои навыки в React JS. Давайте сделаем обучение реагировать весело и интерактивно во время этого Hacktoberfest! Счастливого кодирования и счастливого хактоберфеста!

Руководящие принципы вклада

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

Найдите полный список руководящих принципов в файле Anforming.md.

Руководство по управлению репо

Этот репозиторий проводит несколько проектов, и для обеспечения плавного производительности и эффективного управления необходимо соблюдать следующие руководящие принципы:

1. Ограничение размера проекта

• Каждая отдельная папка проекта не должна превышать 15 МБ .
• Если проект требует большего места из -за дополнительных активов или данных, рассмотрите возможность рефакторирования кода или хранения внешних файлов в отдельном месте (например, облачное хранилище или страницы GitHub).

2. Файл Организация

• Проекты должны быть организованы в четко обозначенных папках под корневым каталогом.
• Сохранить структуру папки простой, например, Project_name1/ , Project_name2/ и т. Д.

3. Избегайте больших двоичных файлов

• Не проводите большие двоичные файлы (например, видео, изображения с высоким разрешением, скомпилированные исполняемые файлы) непосредственно в репозиторий.
• Используйте GIT LFS (большое хранилище файлов) для файлов более 100 МБ или рассмотрите возможность хранения больших активов за пределами репозитория и ссылки на них.

4. минимизировать внешние библиотеки

• Минимизировать использование тяжелых сторонних библиотек или внешних зависимостей.
• Используйте файл .gitignore , чтобы исключить ненужные или автогенерируемые файлы (например, node_modules/ , build/ и т. Д.).

5. Регулярная очистка

• Выполните регулярную очистку ненужных файлов (например, журналы, временные файлы).
• Удалите устаревший или неиспользованный код, активы или проекты из репозитория.

6. Сжатие активов

• Сжатие изображения : используйте такие инструменты, как Tinypng, ImageOptim или Squoosh для сжатия изображений (PNG, JPEG и т. Д.), Прежде чем их совершить.
  • Для веб -изображений : используйте соответствующие форматы, такие как WebP , чтобы значительно уменьшить размер без качества.
• Ограниченное разрешение : избегайте использования изображений с высоким разрешением без необходимости. Для большинства проектов реагирования разрешения 72 DPI (точки на дюйм) достаточно для Интернета.
• Использование SVG : используйте файлы SVG , когда это возможно для векторной графики, поскольку они масштабируемые и легкие.
• Сжатие других активов, таких как PDF -файлы и аудиофайлы, используя инструменты сжатия без потерь, прежде чем добавлять их в репозиторий, чтобы уменьшить размер файла.

7. Оптимизировать код для производительности

• Перепредит и Minify : убедитесь, что настройка проекта использует такие инструменты, как WebPack или Vite, для объединения и министерства файлов JavaScript и CSS. Это уменьшает размеры файлов и ускоряет время загрузки.
• Встряхивание дерева : при использовании сторонних библиотек, убедитесь, что импортируйте только необходимые детали (погашение деревьев), чтобы избежать неиспользованного кода.
  • Например, предпочитайте import { Button } from 'library' вместо import * as Library from 'library' .

8. Управление версиями и управлением истории

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

9. Вклад

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

Нормы поведения

Этот проект придерживается значений Hacktoberfest ↗ и кодекса поведения участника ↗. Участвуя, вы должны поддержать этот кодекс. В Addtiona этот проект

Лицензия

Этот репозиторий лицензирован по лицензии MIT.

Лицензия MIT делает резюме и Dont:

Do's's: Используйте код в коммерческих приложениях: например, компания может создать фирменную часть программного обеспечения, которое включает в себя все или часть оригинального открытого исходного кода, а затем взимать деньги за это программное обеспечение. Измените код: другими словами, разработчики могут изменить/обновить код, как им это хотелось. Распределите копии кода и любые модификации: до тех пор, пока исходное уведомление об авторском праве и сама лицензия включена, организация может распространять и продавать копии или модифицированные версии кода. Сублиценс код: это означает, что вы можете включить исходный код в модификацию с более строгой лицензией.

Don't's: не может привлечь к ответственности автора кода юридической ответственности. Не удается удалить уведомление об авторском праве и оригинальную лицензию из вашей версии кода.

Давайте начнем вносить свой вклад и сделаем сообщество с открытым исходным кодом лучше для всех!

React Project для репозитория начинающих

Добро пожаловать в проект React для репозитория начинающих! Это особое место для начинающих, которые увлечены обучением и участвуют в проектах с открытым исходным кодом с использованием React JS. В настоящее время его Hacktoberfest!

ПРИМЕЧАНИЕ № 1: Пожалуйста, внимательно проверьте свой проект, он должен быть без ошибок, ваш проект будет рассмотрен, если рецензент найдет любую ошибку, которую ваш запрос помечен как «недействительный».

Примечание № 2: Не забудьте перечислить свой проект в файле `projects.js` в корневой папке репо. Вы также можете добавить демонстрационную ссылку вашего проекта (если есть)

ПРИМЕЧАНИЕ № 3: Пожалуйста, прочтите [Руководство по управлению репозиции] (https://github.com/ianshulx/react-projects-for-beginners/blob/main/repo_size_guidelines)

Описание

Этот репозиторий служит платформой для проекта React для начинающих участников, которые находятся в своем пути к освоению React JS и хотят внести свой вклад в Hacktoberfest. Это место, где вы можете поделиться своими мини-проектами, учиться у других и способствовать росту сообщества с открытым исходным кодом.

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

Что такое Hacktoberfest?

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

Процесс вклада

1. Вилка : разветвляется это репозиторием GitHub в вашу собственную учетную запись GitHub 2. Клон : клонировать разборку репо (репо, присутствующий на вашей учетной записи) на вашу локальную машину (напоминание: убедитесь, что вы находитесь в каталоге, где вы хотите хранить хранилище).

 git clone https://github.com/ianshulx/React-projects-for-beginners

3. Создайте новую филиал

git checkout -b my-new-branch

4. Изменения : создайте новую филиал и совершите свои изменения в этой филиале. 5. Добавить и совершить

• Добавьте свои изменения

git add .

• Совершить свои изменения. (Напоминание: убедитесь, что ваше соответствующее сообщение включает в себя необходимые детали, чтобы понять изменения (ы))

git commit -m "Relevant message"

6. Push : после всех изменений вступит изменения, вставьте свои изменения в ваше удаленное репо.

git push origin my-new-branch

7. PR : После продвижения изменений поднимите пиар из вашего удаленного репо до филиала Dev Repo (напоминание: убедитесь, что вы соответствуете своему пиарщику, чтобы понять основную тему вашего запроса)

Участвуя в этом репозитории, вы не только внесете свой вклад в открытый исходный код, но и улучшаете свои навыки в React JS. Давайте сделаем обучение реагировать весело и интерактивно во время этого Hacktoberfest! Счастливого кодирования и счастливого хактоберфеста!

Руководящие принципы вклада

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

Найдите полный список руководящих принципов в файле Anforming.md.

Руководство по управлению репо

Этот репозиторий проводит несколько проектов, и для обеспечения плавного производительности и эффективного управления необходимо соблюдать следующие руководящие принципы:

1. Ограничение размера проекта

• Каждая отдельная папка проекта не должна превышать 15 МБ .
• Если проект требует большего места из -за дополнительных активов или данных, рассмотрите возможность рефакторирования кода или хранения внешних файлов в отдельном месте (например, облачное хранилище или страницы GitHub).

2. Файл Организация

• Проекты должны быть организованы в четко обозначенных папках под корневым каталогом.
• Сохранить структуру папки простой, например, Project_name1/ , Project_name2/ и т. Д.

3. Избегайте больших двоичных файлов

• Не проводите большие двоичные файлы (например, видео, изображения с высоким разрешением, скомпилированные исполняемые файлы) непосредственно в репозиторий.
• Используйте GIT LFS (большое хранилище файлов) для файлов более 100 МБ или рассмотрите возможность хранения больших активов за пределами репозитория и ссылки на них.

4. минимизировать внешние библиотеки

• Минимизировать использование тяжелых сторонних библиотек или внешних зависимостей.
• Используйте файл .gitignore , чтобы исключить ненужные или автогенерируемые файлы (например, node_modules/ , build/ и т. Д.).

5. Регулярная очистка

• Выполните регулярную очистку ненужных файлов (например, журналы, временные файлы).
• Удалите устаревший или неиспользованный код, активы или проекты из репозитория.

6. Сжатие активов

• Сжатие изображения : используйте такие инструменты, как Tinypng, ImageOptim или Squoosh для сжатия изображений (PNG, JPEG и т. Д.), Прежде чем их совершить.
  • Для веб -изображений : используйте соответствующие форматы, такие как WebP , чтобы значительно уменьшить размер без качества.
• Ограниченное разрешение : избегайте использования изображений с высоким разрешением без необходимости. Для большинства проектов реагирования разрешения 72 DPI (точки на дюйм) достаточно для Интернета.
• Использование SVG : используйте файлы SVG , когда это возможно для векторной графики, поскольку они масштабируемые и легкие.
• Сжатие других активов, таких как PDF -файлы и аудиофайлы, используя инструменты сжатия без потерь, прежде чем добавлять их в репозиторий, чтобы уменьшить размер файла.

7. Оптимизировать код для производительности

• Перепредит и Minify : убедитесь, что настройка проекта использует такие инструменты, как WebPack или Vite, для объединения и министерства файлов JavaScript и CSS. Это уменьшает размеры файлов и ускоряет время загрузки.
• Встряхивание дерева : при использовании сторонних библиотек, убедитесь, что импортируйте только необходимые детали (погашение деревьев), чтобы избежать неиспользованного кода.
  • Например, предпочитайте import { Button } from 'library' вместо import * as Library from 'library' .

8. Управление версиями и управлением истории

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

9. Вклад

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

Нормы поведения

Этот проект придерживается значений Hacktoberfest ↗ и кодекса поведения участника ↗. Участвуя, вы должны поддержать этот кодекс. В Addtiona этот проект

Лицензия

Этот репозиторий лицензирован по лицензии MIT.

Лицензия MIT делает резюме и Dont:

Do's's: Используйте код в коммерческих приложениях: например, компания может создать фирменную часть программного обеспечения, которое включает в себя все или часть оригинального открытого исходного кода, а затем взимать деньги за это программное обеспечение. Измените код: другими словами, разработчики могут изменить/обновить код, как им это хотелось. Распределите копии кода и любые модификации: до тех пор, пока исходное уведомление об авторском праве и сама лицензия включена, организация может распространять и продавать копии или модифицированные версии кода. Сублиценс код: это означает, что вы можете включить исходный код в модификацию с более строгой лицензией.

Don't's: не может привлечь к ответственности автора кода юридической ответственности. Не удается удалить уведомление об авторском праве и оригинальную лицензию из вашей версии кода.

Давайте начнем вносить свой вклад и сделаем сообщество с открытым исходным кодом лучше для всех!