Idea Arca (Latin : "Idea Vault")는 프로젝트 아이디어 은행입니다. 기술 창의성을 발휘하십시오. 이 영감을주는 저장소를 통해 다양한 기술 분야에서 혁신적인 프로젝트 아이디어를 발견하고 협력하고 생명을 불어 넣으십시오.
| 아스트로 | SCSS | JSON |
|---|---|---|
| YouTube vid | YouTube vid | YouTube vid |
이 비디오를 살펴본 후 코드베이스에서 작업 할 수있을만큼 자격이 있습니다.
이 프로젝트에 기여할 수있는 몇 가지 방법은 다음과 같습니다.
당신이 Git과 Github를 처음 접한다면, 먼저 이것을 살펴 보겠습니다.
- yt video (권장) : https://www.youtube.com/watch?v=rgoj5yh7evk&pp=yguoz2l0igfuzcbnaxrodwi%3d
- 문서 : https://hacktoberfest.com/participation/#beginner-resources
Open-Source를 처음 사용하는 경우 https://www.youtube.com/watch?v=yzevmecydce를 통과 할 수 있습니다.
두 가지 주요 기여 유형은 아래에 설명되어 있습니다 (테마 추가, 아이디어 추가) :
여기서 우리는 웹 사이트의 주제에 대해 이야기하고 있습니다. 테마를 추가하는 프로세스는 (포크 및 클론 후) :
우리는 test 라는 테마를 추가하여 예를 들어 예를 들어 보여줍니다.
./src/components/ThemeSelector.astro 에 새 <option> 추가하십시오. < select name = "themes" id = { id } class = "btn" >
/* other options */
< option value = "neon" > Neon </ option >
</ select > < select name = "themes" id = { id } class = "btn" >
/* other options */
< option value = "neon" > Neon </ option >
/* Added code ? */
< option value = "test" > Test </ option >
</ select >./src/styles/themes.scss 에서 새 class 코드 추가 : 클래스의 이름은 <option> 태그의 value 속성에 주어진 값입니다.
여기서 우리는 사용했다 :
< option value = "test" > Test </ option > 그래서 우리 수업은 test 입니다.
/* Other Codes */
.neon {
--primary-1 : #793fdf ;
--primary-2 : #7091f5 ;
--primary-3 : #97fff4 ;
--primary-4 : #ffffff ;
--sidenav : #793fdfce ;
--gradient : #e600ff ;
} /* Other Codes */
.neon {
/* same */
}
/* Added code ? */
.test {
--primary-1 : #000000 ;
--primary-2 : #000132 ;
--primary-3 : #000245 ;
--primary-4 : #ffffff ;
--sidenav : #0000ce ;
--gradient : #f690fa ;
}--primary-1 : 주요 배경으로 사용됩니다--primary-3 : 주로 내 중요한 텍스트를 사용합니다--primary-4 : 자세한 텍스트로 사용됩니다--sidenav : --primary-1 의 불투명도가 줄어들고 --primary-1 의 ce 추가하십시오.--gradient : 이것은 웹 사이트에 적합한 random color 이며 웹 사이트 상단의 그라디언트 서클의 색상입니다.4 개의 기본 색상에는 https://colorhunt.co/를 사용할 수 있으며 직접 그라디언트를위한 멋진 색상을 선택할 수 있습니다.
여기서 우리는 웹 사이트에 표시된 아이디어에 대해 이야기하고 있습니다. 아이디어를 추가하는 프로세스는 (포크와 복제 후) :
우리는 React 섹션에 아이디어를 추가하여 예를 보여줍니다.
data 안에 ./src/database/MainData.json 에 객체를 추가하십시오. [
{
section : 'React' ,
data : [
{
id : 1 ,
title : 'E-commerce Dashboard' ,
tags : [ 'React' , 'Redux' , 'CSS' , 'API Integration' ] ,
description : 'Lorem Ispum' ,
link : 'https://example-ecommerce-dashboard.com' ,
} ,
] ,
} ,
] ; [
{
section : 'React' ,
data : [
{
// prev code
} ,
/* Added code ? */
{
id : 2 ,
title : 'Test' ,
tags : [ 'React' , 'Redux' , 'scss' , 'API' ] ,
description : 'Give Meaningful Description, there is no word limit' ,
link : 'Working Link' ,
} ,
] ,
} ,
] ; 우리는 새로운 Sectio : BackboneJs 섹션에 아이디어를 추가하여 예를 보여줍니다.
./src/database/sections.json 에 섹션 이름을 추가하여 왼쪽 탐색 패널에 섹션/필드가 표시되도록하십시오. [ 'React' , 'Vue' , 'Svelte' , 'Frontend' , 'Backend' ] ; [ 'React' , 'Vue' , 'Svelte' , 'Frontend' , 'Backend' , 'BackboneJs' ] ;data 안에 ./src/database/MainData.json 에 객체를 추가하십시오. [
{
section : 'React' ,
data : [
{
id : 1 ,
title : 'E-commerce Dashboard' ,
tags : [ 'React' , 'Redux' , 'CSS' , 'API Integration' ] ,
description : 'Lorem Ispum' ,
link : 'Working Link' ,
} ,
] ,
} ,
// Similar Codes for Other Sections
] ; [
// prev Codes
{
section : 'BackboneJs' ,
data : [
{
id : 1 ,
title : 'E-commerce Dashboard' ,
tags : [ 'Backbonejs' ] ,
description : 'Give Meaningful Description, there is no word limit' ,
link : 'Working Link' ,
} ,
] ,
} ,
] ;section : 주요 분야link : 작동하지 않고 부지런한 링크 여야합니다. 호스팅 된 웹 사이트 링크가 될 수 있습니다. 아이디어가 이미 기존의 다른 웹 사이트를 기반으로하는 경우 (DEASS 또는 FEASSS 일 수 있음) 해당 웹 사이트 링크를 제공하십시오.id 고유해야합니다*