Create dummy data for Stacks component

[hidaehyunlee]

1. Stacks.js component

2. Structure

const topstacksData = {
    language: [
    {
      title: "Python",
      sub_title: "빠르고 쉬워 가장 인기있는 언어",
      logo: "https://user-images.githubusercontent.com/37580034/98778872-581c0f80-2436-11eb-8958-e9705a01ce71.png",
      tags: [
        "채용공고 1위",
        "튜토리얼검색량 3위",
        "깃헙 1위"
      ],
      tags_color: ["#387EB8", ],
      contents: [
        {
          highlight: "용도",
          content: "AI, 머신러닝, 딥러닝, 자료 분석, 웹 사이트 제작 및 게임 등.",
        },
        {
          highlight: "장점",
          content: "배우기 쉽다, 가독성이 좋다, 수요가 많다.",
        },
        {
          highlight: "단점",
          content: "느리다, 앱 개발에 부적합하다.",
        },
        {
          highlight: "Youtube, Instagram, 문명IV, FreeCAD",
          content: "이 파이썬으로 개발되었습니다.",
        },
      ],
      like: 0,
      dislike: 0,
    }, {
      title: "Javascript"
                  .
                  .
                  .
    }
  ],
  frontend: [],
  backend: [],
  dbms: [],
  deeplearning: [],
  editor: []
 }

• categoty[] (mapping) : Used the category name in the mihykim's NavBar PR.
  • logo : Web url of logo image .
  • title : Stack name.
  • sub_title : One line explanation of stacks.
  • tags[] (mapping) : Up to 3 in the order in which you to emphasize.
    • tag1
    • tag2
    • tag3
  • tags_color[] : Background color's Hexacode for one or two tags you want to emphasize. I would appreciate it if you could extract a darker tone from the representative colors of each logo! Because the letters are white.
  • **contents[] (**mapping)
    • content1 :
      • highlight: the title of the content that has strong/br tag so that you want to emphasize.
      • content: Please summarize the contents as briefly as possible! At the current size, it is the best fit that the highlight and content of all the contents are in 10 lines.
    • content2
    • content3
    • content4

3. Suggestions

• what do you think about make a github issue to get the url for each logo?
• I think it would be good to give each logo image to jehong by the issue!

---

1. 참고 이미지

2. 구조

const topstacksData = {
    language: [
    {
      title: "Python",
      sub_title: "빠르고 쉬워 가장 인기있는 언어",
      logo: "https://user-images.githubusercontent.com/37580034/98778872-581c0f80-2436-11eb-8958-e9705a01ce71.png",
      tags: [
        "채용공고 1위",
        "튜토리얼검색량 3위",
        "깃헙 1위"
      ],
      tags_color: ["#387EB8", ],
      contents: [
        {
          highlight: "용도",
          content: "AI, 머신러닝, 딥러닝, 자료 분석, 웹 사이트 제작 및 게임 등.",
        },
        {
          highlight: "장점",
          content: "배우기 쉽다, 가독성이 좋다, 수요가 많다.",
        },
        {
          highlight: "단점",
          content: "느리다, 앱 개발에 부적합하다.",
        },
        {
          highlight: "Youtube, Instagram, 문명IV, FreeCAD",
          content: "이 파이썬으로 개발되었습니다.",
        },
      ],
      like: 0,
      dislike: 0,
    }, {
      title: "Javascript"
                  .
                  .
                  .
    }
  ],
  frontend: [],
  backend: [],
  dbms: [],
  deeplearning: [],
  editor: []
 }

• categoty[] (mapping) : 미혜님 navBar PR에 있는 카테고리 명칭을 그대로 사용했습니다.
  • logo : 로고 이미지 웹 url.
  • title : 기술스택 이름.
  • sub_title : 기술스택 한 줄 설명.
  • tags[] (mapping) : 강조하고 싶은 순서로 최대 3개까지.
    • tag1
    • tag2
    • tag3
  • tags_color[] : 강조하고 싶은 태그 1~2개에 넣을 배경 색 헥사코드. 각 로고의 대표색에서 약간 톤을 어둡게 죽여서 추출해주시면 감사합니다! 글자가 흰 색이어서요.
  • contents[] (mapping)
    • content1 :
      • highlight: strong, br 태그가 필요한 설명의 제목이나 강조하고 싶은 단어를 넣어주세요.
      • content: 내용을 최대한 간략하게 정리해서 넣어주세요! 현재 크기에서는 모든 contents의 highlight와 content를 다 합쳐서 10줄일 때 제일 이쁘게 들어갑니다.
    • content2
    • content3
    • content4

3. 건의사항

• kukim 사항
• logo 에 들어갈 url을 얻을 깃헙 이슈를 파면 어떨까요?
• 정아님께 각 로고 이미지 드릴때 이슈로 드려도 좋을 것 같구요!

[joey-ful]

오 마침 파고 왔습니닷! ㅎㅎㅎ 감사해욥

[365kim]

건의사항ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ

          highlight: "Youtube, Instagram, 문명IV, FreeCAD",
          content: "이 파이썬으로 개발되었습니다.",

이부분도 highlight를 서비스 예시 사례같은걸로 바꾸고
content를 Youtube, Instagram, 문명IV, FreeCAD 로 넣는 것은 어떨까용?

[365kim]

제거 검사하면서 같이 해봤는데 json 포맷 수정해야할거같아요...!! ㅠㅠ

[hidaehyunlee]

제거 검사하면서 같이 해봤는데 json 포맷 수정해야할거같아요...!! ㅠㅠ

학스 이게 모죠

[365kim]

엇 근데 다시 생각해보니 저희가 json을 가공해서 자동으로 DB에 입력시키는거면 지금 복사하기 전에 손보는게 맞는거같은데
저희가 직접 입력하는거면 지금 안해도 될것같아요!!

[365kim]

특이사항

• link가 혹시 필요할까봐 추가했는데 넣을 수 없으면 지워도 될 것 같아요
• RDBMS는...😭 10줄... 우선은 이렇게 제출할게요...!!
• 헥사코드는 아래 컬러블록 처럼 넣었어요!
  

{
   "dbms":[
      {
         "title":"ORACLE",
         "sub_title":"미국 오라클사의 관계형 DBMS",
         "logo":"https://user-images.githubusercontent.com/60066472/99815110-3be24600-2b8d-11eb-8574-9446fdb8f80e.png",
         "link":"https://www.oracle.com/in/database/",
         "tags":[
            "RDBMS",
            "글로벌 DB시장 점유율 1위",
            "DB Engines 랭킹 1위"
         ],
         "tags_color":[
            "#DA000A",
            "#C8000A"
         ],
         "contents":[
            {
               "highlight":"장점",
               "content":"대량의 데이터를 처리하기 좋다.\n 공식문서가 잘 쓰여있다."
            },
            {
               "highlight":"단점",
               "content":"라이센스 비용이 높고 설치용량이 크다.\n초보자에게 어렵게 느껴질 수 있다."
            },
            {
               "highlight":"추천대상",
               "content":"대기업 적합"
            },
            {
               "highlight":"지원OS",
               "content":"Windows, Linux"
            }
         ],
         "like":0,
         "dislike":0
      },
      {
         "title":"MySQL",
         "sub_title":"1995년 최초 출시한 오픈소스 RDBMS",
         "logo":"https://user-images.githubusercontent.com/60066472/99815121-3c7adc80-2b8d-11eb-9a8a-687c60bf963f.png",
         "link":"https://www.mysql.com/",
         "tags":[
            "RDBMS",
            "개발자 사용현황조사 1위",
            "DB Engines 랭킹 2위"
         ],
         "tags_color":[
            "#00618A",
            "#D28200"
         ],
         "contents":[
            {
               "highlight":"장점",
               "content":"성능이 우수하다, 사용법이 쉽고 편리하다.\ncommunity 서버는 무료로 사용가능하다."
            },
            {
               "highlight":"지원OS",
               "content":"Windows, Linux, Mac"
            }
         ],
         "like":0,
         "dislike":0
      },
      {
         "title":"PostgreSQL",
         "sub_title":"macOS 서버의 기본 데이터베이스인 RDBMS",
         "logo":"https://user-images.githubusercontent.com/60066472/99815117-3be24600-2b8d-11eb-8dc8-0bd0b1728894.png",
         "link":"https://www.postgresql.org/",
         "tags":[
            "RDBMS",
            "구글트렌드 3위",
            "DB Engines 랭킹 4위"
         ],
         "tags_color":[
            "#316192",
            "#000000"
         ],
         "contents":[
            {
               "highlight":"장점",
               "content":"JSON을 지원한다, 오픈소스이다"
            },
            {
               "highlight":"단점",
               "content":"configuration이 복잡하다."
            },
            {
               "highlight":"지원OS",
               "content":"Windows, Linux, Mac"
            }
         ],
         "like":0,
         "dislike":0
      },
      {
         "title":"MongoDB",
         "sub_title":"NoSQL 계의 부동의 1위",
         "logo":"https://user-images.githubusercontent.com/60066472/99815104-3ab11900-2b8d-11eb-86c2-ca7de32ca753.png",
         "link":"https://www.mongodb.com/",
         "tags":[
            "NoSQL",
            "DB Engines 랭킹 5위",
            "구글트렌드 5위"
         ],
         "tags_color":[
            "#4F9646",
            "#412F1F"
         ],
         "contents":[
            {
               "highlight":"장점",
               "content":"RDB에 비해 속도가 월등하다.\n 스키마 관리가 필요없다."
            },
            {
               "highlight":"단점",
               "content":"복잡한 쿼리를 사용할 수 없다.\n 메모리 사용량이 크다."
            },
            {
               "highlight":"지원OS",
               "content":"Windows, Linux, Mac"
            }
         ],
         "like":0,
         "dislike":0
      },
      {
         "title":"SQLite",
         "sub_title":"모바일앱에 최적화되어 있는 DBMS",
         "logo":"https://user-images.githubusercontent.com/60066472/99815125-3d137300-2b8d-11eb-9461-785741c77c39.png",
         "link":"https://www.sqlite.org/index.html",
         "tags":[
            "RDBMS",
            "개발자 사용현황조사 4위",
            "DB Engines 랭킹 9위"
         ],
         "tags_color":[
            "#003B57",
            "#0F80CC"
         ],
         "contents":[
            {
               "highlight":"장점",
               "content":"모바일앱에 최적화되어있다, 이식성이 좋다. "
            },
            {
               "highlight":"단점",
               "content":"데이터 형식이 비교적 한정되어있다."
            },
            {
               "highlight":"추천대상",
               "content":"사용자가 한 명인 앱 서비스"
            },
            {
               "highlight":"지원OS",
               "content":"Windows, Linux, Mac, iOS, 안드로이드 등"
            }
         ],
         "like":0,
         "dislike":0
      },
      {
         "title":"MS SQL Server",
         "sub_title":" 1989년 마이크로소프트가 개발한 RDBMS",
         "logo":"https://user-images.githubusercontent.com/60066472/99815119-3c7adc80-2b8d-11eb-84fa-8a4b961aec62.png",
         "link":"https://www.microsoft.com/en-in/sql-server/sql-server-2019",
         "tags":[
            "RDBMS",
            "DB Engines 랭킹 3위"
         ],
         "tags_color":[
            "#A42023",
            "#231F1F"
         ],
         "contents":[
            {
               "highlight":"장점",
               "content":"성능이 우수하다."
            },
            {
               "highlight":"단점",
               "content":"느리다, 앱 개발에 부적합하다."
            },
            {
               "highlight":"지원OS",
               "content":"Windows, Linux"
            }
         ],
         "like":0,
         "dislike":0
      }
   ]
}