[ { "id": "fc-block-2-ht31cihid", "layout": { "id": "201", "description": "중앙정렬 고정 사이즈 이미지", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useImageLeft", "type": "checkbox", "description": "use image center" }, { "name": "imageUrl", "type": "image", "description": "image url" }, { "name": "mobileImageUrl", "type": "image", "description": "mobile image url" }, { "name": "imageWidth", "type": "number", "description": "image width" }, { "name": "alt", "type": "text", "description": "이미지를 설명(대체)하는 대표 문구" }, { "name": "useNewTab", "type": "checkbox", "description": "" }, { "name": "link", "type": "text", "description": "link" } ], "values": { "backgroundColor": "#ffffff", "useImageLeft": false, "imageUrl": "", "mobileImageUrl": "", "imageWidth": 980, "alt": "", "useNewTab": true, "link": "" }, "template": "

\">\n

\n <% if (imageUrl || mobileImageUrl) { %>\n <% if(link) { %>\n \" class=\"container__link\" <% if(useNewTab) { %> target=\"_blank\" rel=\"noopener noreferrer\" <% } %>>\n \n \n <% } else { %>\n \n <% } %>\n <% } %>\n

\n" }, "values": { "backgroundColor": "#000", "useImageLeft": true, "imageUrl": "https://cdn.day1company.io/prod/uploads/202408/175505-1395/웹---상세페이지-배너.webp", "mobileImageUrl": "https://cdn.day1company.io/prod/uploads/202408/175515-1395/모바일---상세페이지-배너.webp", "imageWidth": "980", "alt": "", "useNewTab": true, "link": "https://fastcampus.com/id/event/event_online_kafkawebinar" }, "uniqueId": "fc-block-1-l30oqq36z", "isChecked": false, "hidden": true, "hasSyntaxErrorTags": false }, { "id": "fc-block-2-utopmeg63", "layout": { "id": "201", "description": "중앙정렬 고정 사이즈 이미지", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useImageLeft", "type": "checkbox", "description": "use image center" }, { "name": "imageUrl", "type": "image", "description": "image url" }, { "name": "mobileImageUrl", "type": "image", "description": "mobile image url" }, { "name": "imageWidth", "type": "number", "description": "image width" }, { "name": "alt", "type": "text", "description": "이미지를 설명(대체)하는 대표 문구" }, { "name": "useNewTab", "type": "checkbox", "description": "" }, { "name": "link", "type": "text", "description": "link" } ], "values": { "backgroundColor": "#ffffff", "useImageLeft": false, "imageUrl": "", "mobileImageUrl": "", "imageWidth": 980, "alt": "", "useNewTab": true, "link": "" }, "template": "

\">\n

\n" }, "values": { "backgroundColor": "#FF0000", "useImageLeft": false, "imageUrl": "https://cdn.day1company.io/prod/uploads/202405/162707-347/group-1410117029.png", "mobileImageUrl": "", "imageWidth": "500", "alt": "", "useNewTab": true, "link": "" }, "uniqueId": "fc-block-1-zegygp93c", "isChecked": false, "hidden": true, "hasSyntaxErrorTags": false }, { "id": "fc-block-1-m4gvu052i", "layout": { "id": "201", "description": "중앙정렬 고정 사이즈 이미지", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useImageLeft", "type": "checkbox", "description": "use image center" }, { "name": "imageUrl", "type": "image", "description": "image url" }, { "name": "mobileImageUrl", "type": "image", "description": "mobile image url" }, { "name": "imageWidth", "type": "number", "description": "image width" }, { "name": "alt", "type": "text", "description": "이미지를 설명(대체)하는 대표 문구" }, { "name": "useNewTab", "type": "checkbox", "description": "" }, { "name": "link", "type": "text", "description": "link" } ], "values": { "backgroundColor": "#ffffff", "useImageLeft": false, "imageUrl": "", "mobileImageUrl": "", "imageWidth": 980, "alt": "", "useNewTab": true, "link": "" }, "template": "

\">\n

\n" }, "values": { "backgroundColor": "#000", "useImageLeft": false, "imageUrl": "https://cdn.day1company.io/prod/uploads/202405/162730-347/2-main-인니.png", "mobileImageUrl": "https://cdn.day1company.io/prod/uploads/202405/162733-347/인니-m.png", "imageWidth": "500", "alt": "", "useNewTab": true, "link": "" }, "uniqueId": "fc-block-2-nfevat01d", "isChecked": false, "hidden": true, "hasSyntaxErrorTags": false }, { "id": "fc-block-1-7lkdady1d", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "40", "paddingBottom": "40", "backgroundColor": "#000000", "useTextCenter": true, "textSize": "fc-h1-text", "textColor": "#ffffff", "text": "\nTermasuk praktik proyek\nJaminan harga termurah untuk kursus\n\n
\n\n\n\n15 September 00:00\n\n" }, "uniqueId": "fc-block-1-ybc7prlkf", "isChecked": false, "hidden": true }, { "id": "fc-block-3-4as2bcgwh", "layout": { "id": "903", "description": "타이머", "icon": "\n", "params": [ { "name": "title", "type": "text", "description": "title text" }, { "name": "targetTime", "type": "datetime-local", "description": "yyyy-mm-dd hh:mm" }, { "name": "backgroundColor", "type": "text", "description": "배경색(#000000)을 입력해주세요." }, { "name": "textColor", "type": "select", "description": "글자색을 선택해주세요.", "options": [ "white", "black" ] } ], "values": { "title": "최저 가격 마감까지 남은 시간", "targetTime": "", "backgroundColor": "#282828", "textColor": "white" }, "template": "\n

\">\n

<%=title%>

\n 0일\n 0시간\n 0분\n 0초\n\n <% if (targetTime) { %>\n <%=targetTime %>\n <% } %>\n

\n" }, "values": { "title": "⚠ Hingga kenaikan harga tersisa waktu ⚠", "targetTime": "2025-09-14T23:59", "backgroundColor": "#FF0000", "textColor": "white" }, "uniqueId": "fc-block-3-iu3gd0j86", "isChecked": false, "hidden": true, "hasSyntaxErrorTags": false }, { "id": "fc-block-1-95gw84cpb", "layout": { "id": "910", "description": "쿠폰 발급", "icon": "\n", "params": [ { "name": "startDate", "type": "datetime-local", "description": "yyyy-mm-dd hh:mm" }, { "name": "endDate", "type": "datetime-local", "description": "yyyy-mm-dd hh:mm" }, { "name": "paddingTop", "type": "number", "description": "padding-top" }, { "name": "paddingBottom", "type": "number", "description": "padding-bottom" }, { "name": "colorTheme", "type": "select", "description": "bright or dark", "options": [ "bright", "dark" ] }, { "name": "couponColor", "type": "text", "description": "coupon color" }, { "name": "couponTextColor", "type": "text", "description": "coupon text color" }, { "name": "title", "type": "text", "description": "title" }, { "name": "content", "type": "text", "description": "content" }, { "name": "buttonText", "type": "text", "description": "button text" }, { "name": "buttonTextColor", "type": "text", "description": "button text color" }, { "name": "buttonBgColor", "type": "text", "description": "button backgrond color" }, { "name": "showRemainingCoupons", "type": "checkbox", "description": "" }, { "name": "coupons", "type": "list", "description": "쿠폰 리스트", "maxLength": 20, "params": [ { "name": "couponTemplateCode", "type": "text", "description": "쿠폰 코드" } ] } ], "values": { "startDate": "", "endDate": "", "paddingTop": 0, "paddingBottom": 0, "colorTheme": "bright", "couponColor": "#121212", "couponTextColor": "#ffffff", "title": "제목을 입력해주세요.", "content": "본문을 입력해주세요.", "buttonText": "쿠폰 모두 받기", "buttonTextColor": "#ffffff", "buttonBgColor": "#ED234B", "showRemainingCoupons": true, "coupons": [ { "couponTemplateCode": "" } ] }, "template": "

\"\n style=\"padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem;\"\n data-start-date=\"<%= startDate %>\"\n data-end-date=\"<%= endDate %>\"\n data-padding-top=\"<%= paddingTop || '0' %>\"\n data-padding-bottom=\"<%= paddingBottom || '0' %>\"\n data-color-theme=\"<%= colorTheme || 'bright' %>\"\n data-coupon-color=\"<%= couponColor || '#121212' %>\"\n data-coupon-text-color=\"<%= couponTextColor || '#ffffff' %>\"\n data-title=\"<%= title || '제목을 입력해주세요.' %>\"\n data-content=\"<%= content || '본문을 입력해주세요.' %>\"\n data-button-text=\"<%= buttonText || '쿠폰 모두 받기' %>\"\n data-button-text-color=\"<%= buttonTextColor || '#ffffff' %>\"\n data-button-bg-color=\"<%= buttonBgColor || '#ED234B' %>\"\n data-show-remaining-coupons=\"<%= showRemainingCoupons %>\"\n data-coupon-codes=\"<%= coupons.map(({ couponTemplateCode }) => couponTemplateCode) %>\">\n

<%= title || '제목을 입력해주세요.' %>

<%= content || '본문을 입력해주세요.' %>

; color: <%= couponTextColor || '#ffffff' %> \">\n
\n
\n
\n
COUPON
\n (자동 구성)\n
\n
\n
\n
\n
\n (자동 구성)\n
\n
\n
\n

\n <% if (showRemainingCoupons) { %>\n

(자동 구성)

\n <% } %>\n

\n \n

\n" }, "values": { "startDate": "2024-05-01T00:00", "endDate": "2025-09-15T01:59", "paddingTop": "20", "paddingBottom": "20", "colorTheme": "dark", "couponColor": "#D5022C", "couponTextColor": "#ffffff", "title": "Sebelum Harganya Naik 15 September", "content": "Harga Terendah Sekarang", "buttonText": "Download", "buttonTextColor": "#ffffff", "buttonBgColor": "#D5022C", "showRemainingCoupons": false, "coupons": [ { "couponTemplateCode": "CL251VRX2Y8FK" } ] }, "uniqueId": "fc-block-1-bc1ubg2ma", "isChecked": false, "hidden": true, "hasSyntaxErrorTags": false }, { "id": "fc-block-1-xvlh82he3", "layout": { "id": "803", "description": "앵커탭바", "icon": "\n", "params": [ { "name": "paddingTop", "label": "안쪽 여백: 위", "type": "number", "description": "· 앵커탭바 상단 여백 공간
· PC, Mobile 고려하여 높이값 설정" }, { "name": "paddingBottom", "label": "안쪽 여백: 아래", "type": "number", "description": "· 앵커탭바 하단 여백 공간
· PC, Mobile 고려하여 높이값 설정" }, { "name": "colorTheme", "label": "색상 테마", "type": "select", "description": "앵커탭바 색상 테마 선택
1. theme-light-mono: 흰색 배경에 검정색 텍스트
2. theme-dark-mono: 검은 배경에 흰색 텍스트
3. theme-light-red: 흰색 배경에 FC 레드 텍스트
4. theme-dark-red: 검은 배경에 FC 레드 텍스트
5. theme-light-free: 흰색 배경에 원하는 글자색 지정
6. theme-dark-free: 검은 배경에 원하는 글자색 지정
· 테마 고정형 (1~4번 선택시, pointColor 지정 불가)
· 테마 자유형 (5~6번 선택시, pointColor 지정 가능)", "options": [ "theme-light-mono", "theme-dark-mono", "theme-light-red", "theme-dark-red", "theme-light-free", "theme-dark-free" ] }, { "name": "pointColor", "type": "text", "description": "· 테마 자유형 선택시, pointColor 입력 (입력하지 않는 경우 #000 흰색으로 보여짐)
· 테마 고정형에서는 작동하지 않음" }, { "name": "enableMobileScroll", "type": "checkbox", "description": "모바일에서 앵커탭바 가로스크롤 필요한 경우 체크
체크O: 모바일에서 앵커 메뉴 길이가 화면 사이즈보다 넘칠 경우 스크롤 됨.
체크X: 모바일에서 화면 가로 너비에 맞게 고루 배치됩니다.
모바일 미리보기 페이지에서 체크여부 미리 체크 권장.
" }, { "name": "tabs", "label": "탭 메뉴", "type": "list", "description": "<메뉴 탭>
콘텐츠 추가/제거를 통해 메뉴 구성", "maxLength": 20, "params": [ { "name": "label", "label": "탭 제목", "type": "text", "description": "<메뉴명(레이블)>
키보드 spacing 사용시 단어 단위로 줄바꿈 될 수 있음
미리보기 페이지에서 확인 필요" }, { "name": "id", "label": "연결될 탭 id", "type": "text", "description": "· 메뉴 클릭시 이동할 위치 지정
· 자유입력 가능하며, 804 레이어에 지정할 id와 동일한 텍스트 입력
· 사용자가 메뉴를 클릭시, 해당 레이어 위치로 화면이 스크롤 됨
" } ] } ], "values": { "paddingTop": 20, "paddingBottom": 20, "colorTheme": "theme-light-mono", "enableMobileScroll": false, "pointColor": "", "tabs": [ { "label": "", "id": "" } ] }, "template": "

\" style=\"--stroke-color: <%= pointColor %>\">\n

\n \" style=\"padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n <%= label %>\n \n

\n" }, "values": { "paddingTop": 20, "paddingBottom": 20, "colorTheme": "theme-dark-red", "enableMobileScroll": true, "pointColor": "", "tabs": [ { "label": "Overview", "id": "tab1" }, { "label": "Instruktur", "id": "tab2" }, { "label": "Proyek", "id": "tab3" }, { "label": "Unique Points", "id": "tab4" }, { "label": "Kurikulum", "id": "tab5" } ] }, "uniqueId": "fc-block-1-wyvjx4vzl", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-2-kuaz45s2q", "layout": { "id": "804", "description": "앵커탭영역", "icon": "\n", "params": [ { "name": "id", "label": "id", "type": "text", "description": "연결 될 탭 영역에 대한 id 값" } ], "values": { "id": "" }, "template": "\n" }, "values": { "id": "tab1" }, "uniqueId": "fc-block-2-bwidfdv29", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-6-tdx98oq2x", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "80", "paddingBottom": "30", "backgroundColor": "#DEDEDE", "useTextCenter": true, "textSize": "fc-h5-text", "textColor": "#0C151A", "text": "Masalah frontend developer yang jarang terselesaikan di kursus lain" }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-2-z215hz5xa", "isChecked": false }, { "id": "fc-block-4-hgulagtqj", "layout": { "id": "103", "description": "배경이미지가 있는 1단 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextLeft", "type": "checkbox", "description": "use text left" }, { "name": "backgroundColorOpacity", "type": "number", "description": "1~100" }, { "name": "backgroundImageUrl", "type": "image", "description": "1920 x auto" }, { "name": "mobileBackgroundImageUrl", "type": "image", "description": "mobile background image url" }, { "name": "textColor", "type": "text", "description": "font color" }, { "name": "textSize1", "type": "select", "description": "text size1", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "text1", "type": "textarea", "description": "text1" }, { "name": "textSize2", "type": "select", "description": "text size2", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "text2", "type": "textarea", "description": "text2" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextLeft": false, "backgroundColorOpacity": 50, "backgroundImageUrl": "", "mobileBackgroundImageUrl": "", "textColor": "#000000", "textSize1": "fc-h1-text", "text1": "", "textSize2": "fc-content-text", "text2": "" }, "template": "

rem; padding-bottom: <%=paddingBottom/10%>rem;\">\n

\n <% if (text1) { %>\n

\" style=\"<% if(textColor) { %>color: <%= textColor %>;<% } %>; <% if (useTextLeft) { %> text-align: left;<% } %>\"><%= text1 %>

\n <% } %>\n <% if (text2) { %>\n

\" style=\"<% if(textColor) { %>color: <%= textColor %>;<% } %>; <% if (useTextLeft) { %> text-align: left;<% } %>\"><%= text2 %>

\n <% } %>\n

background: <%= backgroundColor %>; <% } %>opacity: <%= backgroundColorOpacity/100 %>\">

\n" }, "values": { "paddingTop": "58", "paddingBottom": "40", "backgroundColor": "#DEDEDE", "useTextLeft": false, "backgroundColorOpacity": "0", "backgroundImageUrl": "https://cdn.day1company.io/prod/uploads/202403/162710-199/sc2-bg.png", "mobileBackgroundImageUrl": "", "textColor": "#000000", "textSize1": "fc-h1-text", "text1": "

", "textSize2": "fc-content-text", "text2": "" }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-3-qmijzr0w6", "isChecked": false }, { "id": "fc-block-3-n7a4ro3np", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "20", "paddingBottom": "0", "backgroundColor": "#DEDEDE", "useTextCenter": true, "textSize": "fc-content-text", "textColor": "#666666", "text": "Sumber: Survey Channel Youtube Voidfnc" }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-4-bnz63ypfc", "isChecked": false }, { "id": "fc-block-7-6ij8wpsec", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "10", "paddingBottom": "20", "backgroundColor": "#DEDEDE", "useTextCenter": true, "textSize": "fc-h5-text", "textColor": "#0C151A", "text": "\nBuat kamu yang ngalamin masalah ini,
\nsekarang hadir kursus buat belajar React & Redux dengan praktek langsung\n" }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-5-z4d4dhya2", "isChecked": false }, { "id": "fc-block-39-773tl0yt9", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "20", "paddingBottom": 10, "backgroundColor": "#fff", "useTextCenter": true, "textSize": "fc-h5-text", "textColor": "#0C151A", "text": "\n15+ jam praktik dari total waktu belajar!\n" }, "uniqueId": "fc-block-16-8l5noxq8l", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-45-snqorb0vu", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "0", "paddingBottom": "30", "backgroundColor": "#fff", "useTextCenter": true, "textSize": "fc-content-text", "textColor": "#3C3C3C", "text": "Dalam 15+ jam, kuasai skill yang bisa langsung kamu terapkan di dunia nyata,
\nmulai dari implementasi sampai growth, untuk produk berkualitas tinggi!" }, "uniqueId": "fc-block-17-wanj9lqnn", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-24-2ecchcm07", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "10", "paddingBottom": "0", "backgroundColor": "#fff", "useTextCenter": true, "textSize": "fc-h6-text", "textColor": "#000000", "text": "\nKelebihan Pertama yang Bikin Beda\n" }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-15-6xhz1zwpr", "isChecked": false }, { "id": "fc-block-13-8b8ogx1wk", "layout": { "id": "306", "description": "MP4(GIF 대체용)", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "aspectRatio", "type": "select", "description": "aspect ratio", "options": [ "original", "16:9", "4:3" ] }, { "name": "letterboxingBackgroundColor", "type": "text", "description": "letterboxing background color" }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "videoURL1", "type": "video", "description": "최대 5Mb 이하 사용을 권장합니다." }, { "name": "title1", "type": "text", "description": "title text1" }, { "name": "content1", "type": "textarea", "description": "content text1" }, { "name": "videoURL2", "type": "video", "description": "최대 5Mb 이하 사용을 권장합니다." }, { "name": "title2", "type": "text", "description": "title text2" }, { "name": "content2", "type": "textarea", "description": "content text2" }, { "name": "videoURL3", "type": "video", "description": "최대 5Mb 이하 사용을 권장합니다." }, { "name": "title3", "type": "text", "description": "title text3" }, { "name": "content3", "type": "textarea", "description": "content text3" } ], "values": { "backgroundColor": "", "aspectRatio": "16:9", "letterboxingBackgroundColor": "#000000", "textColor": "#000000", "useTextCenter": false, "videoURL1": "", "title1": "", "content1": "", "videoURL2": "", "title2": "", "content2": "", "videoURL3": "", "title3": "", "content3": "" }, "template": "

\">\n

\n <% if (videoURL1 || title1 || content1) { %>\n

; text-align: <%= useTextCenter ? 'center' : 'left' %>\">\n <% if(videoURL1) { %>\n <% if(aspectRatio.includes(':')) { %>\n

%\">\n

\n <% } else { %>\n

\n <% } %>\n <% } %>\n <% if(title1) { %>\n

<%= title1 %>

\n <% } %>\n <% if (content1) { %>\n

<%= content1 %>

\n <% } %>\n

\n <% } %>\n <% if (videoURL2 || title2 || content2) { %>\n

; text-align: <%= useTextCenter ? 'center' : 'left' %>\">\n <% if(videoURL2) { %>\n <% if(aspectRatio.includes(':')) { %>\n

%\">\n

\n <% } else { %>\n

\n <% } %>\n <% } %>\n <% if(title2) { %>\n

<%= title2 %>

\n <% } %>\n <% if (content2) { %>\n

<%= content2 %>

\n <% } %>\n

\n <% } %>\n <% if (videoURL3 || title3 || content3) { %>\n

; text-align: <%= useTextCenter ? 'center' : 'left' %>\">\n <% if(videoURL3) { %>\n <% if(aspectRatio.includes(':')) { %>\n

%\">\n

\n <% } else { %>\n

\n <% } %>\n <% } %>\n <% if(title3) { %>\n

<%= title3 %>

\n <% } %>\n <% if (content3) { %>\n

<%= content3 %>

\n <% } %>\n

\n" }, "values": { "backgroundColor": "", "aspectRatio": "16:9", "letterboxingBackgroundColor": "#000000", "textColor": "#000000", "useTextCenter": false, "videoURL1": "https://cdn.day1company.io/prod/uploads/202404/103018-199/intro-revisi-cc.mp4", "title1": "", "content1": "", "videoURL2": "", "title2": "", "content2": "", "videoURL3": "", "title3": "", "content3": "" }, "uniqueId": "fc-block-2-9ab43supy", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-1-08i65weaz", "layout": { "id": "001", "description": "레이아웃 간격", "icon": "\n", "params": [ { "name": "spacing", "type": "number", "description": "spacing" }, { "name": "backgroundColor", "type": "text", "description": "background color" } ], "values": { "spacing": 10, "backgroundColor": "#ffffff" }, "template": "

rem;\n padding-bottom: <%= spacing/10/2 %>rem;\n background-color: <%= backgroundColor || '#ffffff' %>\">\n

\n" }, "values": { "spacing": "20", "backgroundColor": "#ffffff" }, "uniqueId": "fc-block-1-48semb1lv", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-3-45xvgu3wr", "layout": { "id": "804", "description": "앵커탭영역", "icon": "\n", "params": [ { "name": "id", "label": "id", "type": "text", "description": "연결 될 탭 영역에 대한 id 값" } ], "values": { "id": "" }, "template": "\n" }, "values": { "id": "tab2" }, "uniqueId": "fc-block-3-vus9ylgpe", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-2-p2jxursmg", "layout": { "id": "211", "description": "2단/3단 캐러셀", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "숫자 입력" }, { "name": "paddingBottom", "type": "number", "description": "숫자 입력" }, { "name": "columnCount", "type": "select", "description": "default - 3columns", "options": [ "3", "2" ] }, { "name": "backgroundColor", "type": "text", "description": "배경 색상" }, { "name": "colorTheme", "type": "select", "description": "네가지 테마중 하나를 선택할 수 있습니다.
light theme_red - 밝은 배경에 사용합니다 (버튼포인트)
dark theme_red - 어두운 배경에 사용합니다 (버튼포인트)
light theme_mono - 밝은 배경에 사용합니다
dark theme_mono - 어두운 배경에 사용합니다", "options": [ "theme-light-red", "theme-dark-red", "theme-light-mono", "theme-dark-mono" ] }, { "name": "text1Size", "type": "select", "description": "h5(20px), h6(16px) contents(14px)", "options": [ "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "text2Size", "type": "select", "description": "h5(20px), h6(16px) contents(14px)", "options": [ "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "cards", "type": "list", "description": "추가/삭제를 이용하여 원하는 만큼 카드 리스트를 구현 할 수 있습니다.", "maxLength": 20, "params": [ { "name": "imageUrl", "type": "image", "description": "파일 업로드" }, { "name": "text1", "type": "text", "description": "자유 입력" }, { "name": "text2", "type": "text", "description": "자유 입력" } ] } ], "values": { "paddingTop": 40, "paddingBottom": 40, "columnCount": "3", "backgroundColor": "#ffffff", "colorTheme": "theme-light-red", "text1Size": "fc-h5-text", "text2Size": "fc-h6-text", "cards": [ { "imageUrl": "", "text1": "", "text2": "" }, { "imageUrl": "", "text1": "", "text2": "" }, { "imageUrl": "", "text1": "", "text2": "" } ] }, "template": "

rem;\n padding-bottom: <%= paddingBottom/10 %>rem;\n background-color: <%= backgroundColor || '#ffffff' %>\">\n

\">\n

\n
\">\n <% if (imageUrl) { %>\n \" alt=\"\" />\n <% } %>\n
\n <% if (text1) { %>\n
\"><%= text1 %>
\n <% } %>\n <% if (text2) { %>\n
\"><%= text2 %>
\n <% } %>\n

\n" }, "values": { "paddingTop": "80", "paddingBottom": "80", "columnCount": "3", "backgroundColor": "#0C151A", "colorTheme": "theme-dark-mono", "text1Size": "fc-content-text", "text2Size": "fc-content-text", "cards": [ { "imageUrl": "https://cdn.day1company.io/prod/uploads/202404/102925-199/sc2-1.png", "text1": "", "text2": "" }, { "imageUrl": "https://cdn.day1company.io/prod/uploads/202403/162501-199/sc2-2.png", "text1": "", "text2": "" }, { "imageUrl": "https://cdn.day1company.io/prod/uploads/202403/162504-199/sc2-3.png", "text1": "", "text2": "" } ] }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-1-r4o0xty5b", "isChecked": false }, { "id": "fc-block-40-faop33und", "layout": { "id": "104", "description": "배경이미지가 있는 2단 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "backgroundColorOpacity", "type": "number", "description": "1~100" }, { "name": "backgroundImageUrl", "type": "image", "description": "1920 x auto" }, { "name": "mobileBackgroundImageUrl", "type": "image", "description": "mobile background image url" }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "textSize1", "type": "select", "description": "text size1", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "text1", "type": "textarea", "description": "text1" }, { "name": "textSize2", "type": "select", "description": "text size2", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "text2", "type": "textarea", "description": "text2" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "backgroundColorOpacity": 50, "backgroundImageUrl": "", "mobileBackgroundImageUrl": "", "textColor": "#000000", "textSize1": "fc-content-text", "text1": "", "textSize2": "fc-content-text", "text2": "" }, "template": "

rem; padding-bottom: <%=paddingBottom/10%>rem;\">\n

\">\n

\">\n <%= text1 %>\n

\">\n <%= text2 %>\n

background: <%= backgroundColor %>; <% } %>opacity: <%= backgroundColorOpacity/100 %>\">

\n" }, "values": { "paddingTop": "80", "paddingBottom": "40", "backgroundColor": "#0C151A", "backgroundColorOpacity": "20", "backgroundImageUrl": "https://cdn.day1company.io/prod/uploads/202403/173755-199/sc4.webp", "mobileBackgroundImageUrl": "", "textColor": "#fff", "textSize1": "fc-content-text", "text1": "\nDari lulusan SMA langsung jadi
\nLead Developer & YouTuber programming\n\n
\nSekarang Theo siap berbagi materi React & Redux
\nhanya di kursus online Fast campus!\n

\n\nCourse ini aku design dengan menggunakan metode project-based learning. Melalui berbagai macam real case, kita bakal belajar dan implementasi berbagai macam fitur mulai dari yang basic sampai advanced.\nProduct searching, cart, checkout, sampai admin page, semua fitur dan alur pembelajaran sudah di-design untuk meng-cover berbagai macam core features dari React, dan best practices yang bisa kita lakukan!\n", "textSize2": "fc-content-text", "text2": "

" }, "uniqueId": "fc-block-1-fg1iixlyf", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-5-5lch61zc6", "layout": { "id": "102", "description": "2단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize1", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor1", "type": "text", "description": "text color" }, { "name": "text1", "type": "textarea", "description": "text" }, { "name": "textSize2", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor2", "type": "text", "description": "text color" }, { "name": "text2", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize1": "fc-h1-text", "textColor1": "#000000", "text1": "", "textSize2": "fc-h1-text", "textColor2": "#000000", "text2": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n <% if(text1) { %>\n

\" style=\"<% if(textColor1) { %>color: <%= textColor1 %><% } %>\">\n <%= text1 %>\n

\n <% } %>\n <% if(text2) { %>\n

\" style=\"<% if(textColor2) { %>color: <%= textColor2 %><% } %>\">\n <%= text2 %>\n

\n <% } %>\n

\n" }, "values": { "paddingTop": "40", "paddingBottom": "80", "backgroundColor": "#0C151A", "useTextCenter": false, "textSize1": "fc-content-text", "textColor1": "#fff", "text1": "\nRiwayat Karir\n
\n
\nSaat Ini\n
\n· Youtuber Programming (VoidFnc)
\n· CTO / fanAttics Technology\n

\nSebelumnya\n
\n· Lead Software Engineer
\n· Indonesia Crowdfunding Exchange", "textSize2": "fc-content-text", "textColor2": "#fff", "text2": "\nPengajar\n
\n
\nPengajar Developer\n
\n

\n
\nBootcamp\n
\n· Pengajar Senior Lecturer di Purwadhika Digital Technology School
\n· Manager Akademis untuk Web Development di Purwadhika" }, "uniqueId": "fc-block-1-z7xrgf7pk", "isChecked": false, "hasSyntaxErrorTags": true }, { "id": "fc-block-20-uyiyket7z", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "80", "paddingBottom": "10", "backgroundColor": "#EFF5F6", "useTextCenter": false, "textSize": "fc-h6-text", "textColor": "#8858FA", "text": "\nQuestion 1.\n" }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-10-fwsgsac6x", "isChecked": false }, { "id": "fc-block-21-hp86338ep", "layout": { "id": "102", "description": "2단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize1", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor1", "type": "text", "description": "text color" }, { "name": "text1", "type": "textarea", "description": "text" }, { "name": "textSize2", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor2", "type": "text", "description": "text color" }, { "name": "text2", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize1": "fc-h1-text", "textColor1": "#000000", "text1": "", "textSize2": "fc-h1-text", "textColor2": "#000000", "text2": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n <% if(text1) { %>\n

\" style=\"<% if(textColor1) { %>color: <%= textColor1 %><% } %>\">\n <%= text1 %>\n

\n <% } %>\n <% if(text2) { %>\n

\" style=\"<% if(textColor2) { %>color: <%= textColor2 %><% } %>\">\n <%= text2 %>\n

\n <% } %>\n

\n" }, "values": { "paddingTop": "0", "paddingBottom": "0", "backgroundColor": "#EFF5F6", "useTextCenter": false, "textSize1": "fc-h5-text", "textColor1": "#0C151A", "text1": "Apa sih bedanya kursus ini
\nsama konten yang ada di
\nYoutube?", "textSize2": "fc-content-text", "textColor2": "#0C151A", "text2": "Materi-materi yang ada di YouTube cuma membahas dasar-dasar teknologi dan contoh penggunaannya.
\nDi kursus ini, kita ga cuma bikin fitur dasar tapi juga yang tingkat lanjut.\nSelain itu, kursus ini belajarnya sambil ngerjain project. Jadi, selain belajar konsep baru, kamu juga bakal ngeliat penerapannya di dunia nyata! " }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-11-qlczcsps7", "isChecked": false }, { "id": "fc-block-19-jmnb4cmor", "layout": { "id": "003", "description": "문단 구분 선", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "borderColor", "type": "text", "description": "border color" }, { "name": "borderSize", "type": "select", "description": "size", "options": [ "1", "2" ] } ], "values": { "backgroundColor": "#ffffff", "paddingTop": 10, "paddingBottom": 10, "borderColor": "#c8c8d2", "borderSize": "1" }, "template": "

\">\n

rem;padding-bottom: <%= paddingBottom/10 %>rem;\">\n

rem solid <%= borderColor %>;\">\n

\n" }, "values": { "backgroundColor": "#EFF5F6", "paddingTop": "30", "paddingBottom": "30", "borderColor": "#C9D6D7", "borderSize": "1" }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-12-693n0fe97", "isChecked": false }, { "id": "fc-block-30-3wehgr4ab", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "0", "paddingBottom": "10", "backgroundColor": "#EFF5F6", "useTextCenter": false, "textSize": "fc-h6-text", "textColor": "#8858FA", "text": "\nQuestion 2.\n" }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-13-1f998u3tu", "isChecked": false }, { "id": "fc-block-31-dzd7h3khb", "layout": { "id": "102", "description": "2단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize1", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor1", "type": "text", "description": "text color" }, { "name": "text1", "type": "textarea", "description": "text" }, { "name": "textSize2", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor2", "type": "text", "description": "text color" }, { "name": "text2", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize1": "fc-h1-text", "textColor1": "#000000", "text1": "", "textSize2": "fc-h1-text", "textColor2": "#000000", "text2": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n <% if(text1) { %>\n

\" style=\"<% if(textColor1) { %>color: <%= textColor1 %><% } %>\">\n <%= text1 %>\n

\n <% } %>\n <% if(text2) { %>\n

\" style=\"<% if(textColor2) { %>color: <%= textColor2 %><% } %>\">\n <%= text2 %>\n

\n <% } %>\n

\n" }, "values": { "paddingTop": "0", "paddingBottom": "80", "backgroundColor": "#EFF5F6", "useTextCenter": false, "textSize1": "fc-h5-text", "textColor1": "#0C151A", "text1": "Kenapa sih harus belajar
\nprinsip-prinsip React & Redux?", "textSize2": "fc-content-text", "textColor2": "#0C151A", "text2": "Saat ini masih menjadi salah satu library/framework paling laku di pasar, React adalah pilihan yang pas untuk kalian yang mau upgrade skill Front End. Selain sering dicari di job market, React juga memiliki komunitas yang sangat luas sehingga memudahkan kita untuk berkolaborasi ataupun belajar bersama.
\nReact bukan sebuah framework yang sulit dipelajari, tetapi selain penggunaan yang mudah, penting juga untuk kita bisa membuat project yang besar mudah di-manage.
\nPenggunaan Redux dalam React juga sangatlah populer untuk melakukan global state management agar project yang kompleks pun akan mudah diatur. Dengan mengenal core principals dari React dan Redux, kita tidak hanya akan tau cara pakai, tapi juga tau cara menggunakan dengan efektif." }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-14-znvfg1d8g", "isChecked": false }, { "id": "fc-block-14-p4jrxer4k", "layout": { "id": "201", "description": "중앙정렬 고정 사이즈 이미지", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useImageLeft", "type": "checkbox", "description": "use image center" }, { "name": "imageUrl", "type": "image", "description": "image url" }, { "name": "mobileImageUrl", "type": "image", "description": "mobile image url" }, { "name": "imageWidth", "type": "number", "description": "image width" }, { "name": "alt", "type": "text", "description": "이미지를 설명(대체)하는 대표 문구" }, { "name": "useNewTab", "type": "checkbox", "description": "" }, { "name": "link", "type": "text", "description": "link" } ], "values": { "backgroundColor": "#ffffff", "useImageLeft": false, "imageUrl": "", "mobileImageUrl": "", "imageWidth": 980, "alt": "", "useNewTab": true, "link": "" }, "template": "

\">\n

\n" }, "values": { "backgroundColor": "#ffffff", "useImageLeft": false, "imageUrl": "https://cdn.day1company.io/prod/uploads/202404/105132-199/intro-revisi-cc.gif", "mobileImageUrl": "", "imageWidth": 980, "alt": "", "useNewTab": true, "link": "" }, "hidden": true, "uniqueId": "fc-block-1-0d9sijy27", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-4-2efc1tkwm", "layout": { "id": "804", "description": "앵커탭영역", "icon": "\n", "params": [ { "name": "id", "label": "id", "type": "text", "description": "연결 될 탭 영역에 대한 id 값" } ], "values": { "id": "" }, "template": "\n" }, "values": { "id": "tab3" }, "uniqueId": "fc-block-4-zco65rs1f", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-4-qnede7lr7", "layout": { "id": "211", "description": "2단/3단 캐러셀", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "숫자 입력" }, { "name": "paddingBottom", "type": "number", "description": "숫자 입력" }, { "name": "columnCount", "type": "select", "description": "default - 3columns", "options": [ "3", "2" ] }, { "name": "backgroundColor", "type": "text", "description": "배경 색상" }, { "name": "colorTheme", "type": "select", "description": "네가지 테마중 하나를 선택할 수 있습니다.
light theme_red - 밝은 배경에 사용합니다 (버튼포인트)
dark theme_red - 어두운 배경에 사용합니다 (버튼포인트)
light theme_mono - 밝은 배경에 사용합니다
dark theme_mono - 어두운 배경에 사용합니다", "options": [ "theme-light-red", "theme-dark-red", "theme-light-mono", "theme-dark-mono" ] }, { "name": "text1Size", "type": "select", "description": "h5(20px), h6(16px) contents(14px)", "options": [ "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "text2Size", "type": "select", "description": "h5(20px), h6(16px) contents(14px)", "options": [ "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "cards", "type": "list", "description": "추가/삭제를 이용하여 원하는 만큼 카드 리스트를 구현 할 수 있습니다.", "maxLength": 20, "params": [ { "name": "imageUrl", "type": "image", "description": "파일 업로드" }, { "name": "text1", "type": "text", "description": "자유 입력" }, { "name": "text2", "type": "text", "description": "자유 입력" } ] } ], "values": { "paddingTop": 40, "paddingBottom": 40, "columnCount": "3", "backgroundColor": "#ffffff", "colorTheme": "theme-light-red", "text1Size": "fc-h5-text", "text2Size": "fc-h6-text", "cards": [ { "imageUrl": "", "text1": "", "text2": "" }, { "imageUrl": "", "text1": "", "text2": "" }, { "imageUrl": "", "text1": "", "text2": "" } ] }, "template": "

rem;\n padding-bottom: <%= paddingBottom/10 %>rem;\n background-color: <%= backgroundColor || '#ffffff' %>\">\n

\">\n

\n
\">\n <% if (imageUrl) { %>\n \" alt=\"\" />\n <% } %>\n
\n <% if (text1) { %>\n
\"><%= text1 %>
\n <% } %>\n <% if (text2) { %>\n
\"><%= text2 %>
\n <% } %>\n

\n" }, "values": { "paddingTop": "30", "paddingBottom": "20", "columnCount": "3", "backgroundColor": "#ffffff", "colorTheme": "theme-light-mono", "text1Size": "fc-h6-text", "text2Size": "fc-content-text", "cards": [ { "imageUrl": "https://cdn.day1company.io/prod/uploads/202403/175023-199/sc6-1.png", "text1": "\n\nFitur 1.\n\n
\nLayout Home Page", "text2": "\nDengan mengonfigurasi layout homepage, kamu akan belajar tentang komponen React dan teknik routing. Selain itu, kamu juga akan memahami pentingnya desain UI/UX dalam menciptakan kesan pertama yang baik buat user.\n\n
\n

" }, { "imageUrl": "https://cdn.day1company.io/prod/uploads/202403/175013-199/sc6-2.png", "text1": "\n\nFitur 2.\n\n
\nBikin UI jadi lebih dinamis", "text2": "\nBelajar bikin UI dinamis yang responsif terhadap interaksi pengguna dengan state management dan event handling. Di bagian ini, kamu akan mendalami konsep inti React seperti props dan state.\n\n
\n

" }, { "imageUrl": "https://cdn.day1company.io/prod/uploads/202403/175028-199/sc6-3.png", "text1": "\n\nFitur 3.\n\n
\nLayouting Admin Dashboard", "text2": "\nDengan membangun dashboard admin, kamu akan terlatih implementasi layout kompleks dan fungsi manajemen data, dan belajar memanfaatkan berbagai tools dan library yang disediakan oleh React.\n\n
\n

" } ] }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-1-hyro7t770", "isChecked": false }, { "id": "fc-block-42-m6hgkc9rj", "layout": { "id": "211", "description": "2단/3단 캐러셀", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "숫자 입력" }, { "name": "paddingBottom", "type": "number", "description": "숫자 입력" }, { "name": "columnCount", "type": "select", "description": "default - 3columns", "options": [ "3", "2" ] }, { "name": "backgroundColor", "type": "text", "description": "배경 색상" }, { "name": "colorTheme", "type": "select", "description": "네가지 테마중 하나를 선택할 수 있습니다.
light theme_red - 밝은 배경에 사용합니다 (버튼포인트)
dark theme_red - 어두운 배경에 사용합니다 (버튼포인트)
light theme_mono - 밝은 배경에 사용합니다
dark theme_mono - 어두운 배경에 사용합니다", "options": [ "theme-light-red", "theme-dark-red", "theme-light-mono", "theme-dark-mono" ] }, { "name": "text1Size", "type": "select", "description": "h5(20px), h6(16px) contents(14px)", "options": [ "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "text2Size", "type": "select", "description": "h5(20px), h6(16px) contents(14px)", "options": [ "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "cards", "type": "list", "description": "추가/삭제를 이용하여 원하는 만큼 카드 리스트를 구현 할 수 있습니다.", "maxLength": 20, "params": [ { "name": "imageUrl", "type": "image", "description": "파일 업로드" }, { "name": "text1", "type": "text", "description": "자유 입력" }, { "name": "text2", "type": "text", "description": "자유 입력" } ] } ], "values": { "paddingTop": 40, "paddingBottom": 40, "columnCount": "3", "backgroundColor": "#ffffff", "colorTheme": "theme-light-red", "text1Size": "fc-h5-text", "text2Size": "fc-h6-text", "cards": [ { "imageUrl": "", "text1": "", "text2": "" }, { "imageUrl": "", "text1": "", "text2": "" }, { "imageUrl": "", "text1": "", "text2": "" } ] }, "template": "

rem;\n padding-bottom: <%= paddingBottom/10 %>rem;\n background-color: <%= backgroundColor || '#ffffff' %>\">\n

\">\n

\n
\">\n <% if (imageUrl) { %>\n \" alt=\"\" />\n <% } %>\n
\n <% if (text1) { %>\n
\"><%= text1 %>
\n <% } %>\n <% if (text2) { %>\n
\"><%= text2 %>
\n <% } %>\n

\n" }, "values": { "paddingTop": "0", "paddingBottom": "80", "columnCount": "3", "backgroundColor": "#ffffff", "colorTheme": "theme-light-mono", "text1Size": "fc-h6-text", "text2Size": "fc-content-text", "cards": [ { "imageUrl": "https://cdn.day1company.io/prod/uploads/202403/175545-199/sc6-4.png", "text1": "\n\nFitur 4.\n\n
\nAutentikasi", "text2": "\nMenerapkan fungsi autentikasi pengguna akan membantu memahami pentingnya keamanan dalam aplikasi web development, termasuk konsep autentikasi dan otorisasi. Kamu akan membangun alur login dan logout menggunakan React Router dan Redux.\n\n
\n

" }, { "imageUrl": "https://cdn.day1company.io/prod/uploads/202403/175640-199/sc6-5.png", "text1": "\n\nFitur 5.\n\n
\nMempersiapkan Keranjang", "text2": "\nDengan membangun fitur keranjang belanja, kamu akan belajar menerapkan fungsi inti toko online, seperti pemilihan produk, penyesuaian jumlah, dan pengelolaan item dalam keranjang. Proses ini akan menekankan pentingnya pengelolaan state secara global dan cara menggunakan Redux.\n\n
\n

" }, { "imageUrl": "https://cdn.day1company.io/prod/uploads/202403/175643-199/sc6-6.png", "text1": "\n\nFitur 6.\n\n
\nHalaman Riwayat Transaksi", "text2": "\nDengan membangun halaman riwayat transaksi, pengguna bisa melihat transaksi mereka sebelumnya. Proses pembuatan fitur ini akan mengajarkan cara mengelola data secara efektif dan menyediakan interface yang ramah buat user.\n\n
\n

" } ] }, "uniqueId": "fc-block-2-dhd9hrvho", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-23-ze4kv6k1p", "layout": { "id": "201", "description": "중앙정렬 고정 사이즈 이미지", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useImageLeft", "type": "checkbox", "description": "use image center" }, { "name": "imageUrl", "type": "image", "description": "image url" }, { "name": "mobileImageUrl", "type": "image", "description": "mobile image url" }, { "name": "imageWidth", "type": "number", "description": "image width" }, { "name": "alt", "type": "text", "description": "이미지를 설명(대체)하는 대표 문구" }, { "name": "useNewTab", "type": "checkbox", "description": "" }, { "name": "link", "type": "text", "description": "link" } ], "values": { "backgroundColor": "#ffffff", "useImageLeft": false, "imageUrl": "", "mobileImageUrl": "", "imageWidth": 980, "alt": "", "useNewTab": true, "link": "" }, "template": "

\">\n

\n" }, "values": { "backgroundColor": "#ffffff", "useImageLeft": false, "imageUrl": "https://cdn.day1company.io/prod/uploads/202403/164923-199/sc6-cta.png", "mobileImageUrl": "", "imageWidth": "520", "alt": "", "useNewTab": true, "link": "https://fastcampus.com/en" }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-19-sr0s5i5rp", "isChecked": false, "hidden": true }, { "id": "fc-block-7-c5gyk12gy", "layout": { "id": "001", "description": "레이아웃 간격", "icon": "\n", "params": [ { "name": "spacing", "type": "number", "description": "spacing" }, { "name": "backgroundColor", "type": "text", "description": "background color" } ], "values": { "spacing": 10, "backgroundColor": "#ffffff" }, "template": "

rem;\n padding-bottom: <%= spacing/10/2 %>rem;\n background-color: <%= backgroundColor || '#ffffff' %>\">\n

\n" }, "values": { "spacing": "30", "backgroundColor": "#ffffff" }, "uniqueId": "fc-block-2-gvnnlx8m1", "isChecked": false, "hasSyntaxErrorTags": false, "hidden": true }, { "id": "fc-block-1-4eh0ojvis", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "40", "paddingBottom": "20", "backgroundColor": "#7A69F6", "useTextCenter": true, "textSize": "fc-h4-text", "textColor": "#fff", "text": "👇Pratinjau Kuliah👇" }, "uniqueId": "fc-block-1-ehcjy4xjc", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-2-vn7tze15g", "layout": { "id": "302", "description": "1~3단 동영상과 텍스트", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "fontColor", "type": "text", "description": "font color" }, { "name": "titleSize", "type": "select", "description": "title size", "options": [ "fc-h5-text", "fc-h6-text" ] }, { "name": "contentSize", "type": "select", "description": "content size", "options": [ "fc-h6-text", "fc-content-text" ] }, { "name": "videoPlatformType1", "type": "select", "description": "videoPlatformType1", "options": [ "Youtube", "Vimeo" ] }, { "name": "video1", "type": "video", "description": "video1" }, { "name": "title1", "type": "textarea", "description": "title1 text" }, { "name": "content1", "type": "textarea", "description": "content text" }, { "name": "videoPlatformType2", "type": "select", "description": "videoPlatformType2", "options": [ "Youtube", "Vimeo" ] }, { "name": "video2", "type": "video", "description": "video2" }, { "name": "title2", "type": "textarea", "description": "title2 text" }, { "name": "content2", "type": "textarea", "description": "content text" }, { "name": "videoPlatformType3", "type": "select", "description": "videoPlatformType3", "options": [ "Youtube", "Vimeo" ] }, { "name": "video3", "type": "video", "description": "video3" }, { "name": "title3", "type": "textarea", "description": "title3 text" }, { "name": "content3", "type": "textarea", "description": "content text" } ], "values": { "backgroundColor": "", "fontColor": "#000000", "titleSize": "fc-h5-text", "contentSize": "fc-h6-text", "videoPlatformType1": "Youtube", "video1": "", "title1": "", "content1": "", "videoPlatformType2": "Youtube", "video2": "", "title2": "", "content2": "", "videoPlatformType3": "Youtube", "video3": "", "title3": "", "content3": "" }, "template": "

background-color: <%=backgroundColor%><% } %>\">\n

\">\n

\n <% if (video1 || title1 || content1) { %>\n

\n <% if (video1) { %>\n

\n <% if (videoPlatformType1 === 'Youtube') { %>\n \n <% } else { %>\n \n <% } %>\n

\n <% } %>\n <% if (title1) { %>\n

\"><%= title1 %>

\n <% } %>\n <% if(content1) { %>\n

\"><%= content1 %>

\n <% } %>\n

\n <% } %>\n <% if (video2 || title2 || content2) { %>\n

\n <% if (video2) { %>\n

\n <% if (videoPlatformType2 === 'Youtube') { %>\n \n <% } else { %>\n \n <% } %>\n

\n <% } %>\n <% if (title2) { %>\n

\"><%= title2 %>

\n <% } %>\n <% if(content2) { %>\n

\"><%= content2 %>

\n <% } %>\n

\n <% } %>\n <% if (video3 || title3 || content3) { %>\n

\n <% if (video3) { %>\n

\n <% if (videoPlatformType3 === 'Youtube') { %>\n \n <% } else { %>\n \n <% } %>\n

\n <% } %>\n <% if (title3) { %>\n

\"><%= title3 %>

\n <% } %>\n <% if(content3) { %>\n

\"><%= content3 %>

\n <% } %>\n

\n" }, "values": { "backgroundColor": "#7A69F6", "fontColor": "#fff", "titleSize": "fc-h5-text", "contentSize": "fc-h6-text", "videoPlatformType1": "Youtube", "video1": "7myshbCoJDA", "title1": "Memahami struktur file proyek React", "content1": "", "videoPlatformType2": "Youtube", "video2": "TyQFQbtasyw", "title2": "Merancang kartu produk dan tata letak grid kami", "content2": "", "videoPlatformType3": "Youtube", "video3": "", "title3": "", "content3": "" }, "uniqueId": "fc-block-2-ryt88acyj", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-2-u9tos5gs0", "layout": { "id": "302", "description": "1~3단 동영상과 텍스트", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "fontColor", "type": "text", "description": "font color" }, { "name": "titleSize", "type": "select", "description": "title size", "options": [ "fc-h5-text", "fc-h6-text" ] }, { "name": "contentSize", "type": "select", "description": "content size", "options": [ "fc-h6-text", "fc-content-text" ] }, { "name": "videoPlatformType1", "type": "select", "description": "videoPlatformType1", "options": [ "Youtube", "Vimeo" ] }, { "name": "video1", "type": "video", "description": "video1" }, { "name": "title1", "type": "textarea", "description": "title1 text" }, { "name": "content1", "type": "textarea", "description": "content text" }, { "name": "videoPlatformType2", "type": "select", "description": "videoPlatformType2", "options": [ "Youtube", "Vimeo" ] }, { "name": "video2", "type": "video", "description": "video2" }, { "name": "title2", "type": "textarea", "description": "title2 text" }, { "name": "content2", "type": "textarea", "description": "content text" }, { "name": "videoPlatformType3", "type": "select", "description": "videoPlatformType3", "options": [ "Youtube", "Vimeo" ] }, { "name": "video3", "type": "video", "description": "video3" }, { "name": "title3", "type": "textarea", "description": "title3 text" }, { "name": "content3", "type": "textarea", "description": "content text" } ], "values": { "backgroundColor": "", "fontColor": "#000000", "titleSize": "fc-h5-text", "contentSize": "fc-h6-text", "videoPlatformType1": "Youtube", "video1": "", "title1": "", "content1": "", "videoPlatformType2": "Youtube", "video2": "", "title2": "", "content2": "", "videoPlatformType3": "Youtube", "video3": "", "title3": "", "content3": "" }, "template": "

background-color: <%=backgroundColor%><% } %>\">\n

\">\n

\n <% if (video1 || title1 || content1) { %>\n

\n <% if (video1) { %>\n

\n <% if (videoPlatformType1 === 'Youtube') { %>\n \n <% } else { %>\n \n <% } %>\n

\n <% } %>\n <% if (title1) { %>\n

\"><%= title1 %>

\n <% } %>\n <% if(content1) { %>\n

\"><%= content1 %>

\n <% } %>\n

\n <% } %>\n <% if (video2 || title2 || content2) { %>\n

\n <% if (video2) { %>\n

\n <% if (videoPlatformType2 === 'Youtube') { %>\n \n <% } else { %>\n \n <% } %>\n

\n <% } %>\n <% if (title2) { %>\n

\"><%= title2 %>

\n <% } %>\n <% if(content2) { %>\n

\"><%= content2 %>

\n <% } %>\n

\n <% } %>\n <% if (video3 || title3 || content3) { %>\n

\n <% if (video3) { %>\n

\n <% if (videoPlatformType3 === 'Youtube') { %>\n \n <% } else { %>\n \n <% } %>\n

\n <% } %>\n <% if (title3) { %>\n

\"><%= title3 %>

\n <% } %>\n <% if(content3) { %>\n

\"><%= content3 %>

\n <% } %>\n

rem;\n padding-bottom: <%= spacing/10/2 %>rem;\n background-color: <%= backgroundColor || '#ffffff' %>\">\n

\n" }, "values": { "spacing": "40", "backgroundColor": "#7A69F6" }, "uniqueId": "fc-block-3-ploroajia", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-2-2zjdx6yv9", "layout": { "id": "804", "description": "앵커탭영역", "icon": "\n", "params": [ { "name": "id", "label": "id", "type": "text", "description": "연결 될 탭 영역에 대한 id 값" } ], "values": { "id": "" }, "template": "\n" }, "values": { "id": "tab4" }, "uniqueId": "fc-block-1-ru48l4wou", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-38-860jqsnyf", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "50", "paddingBottom": "0", "backgroundColor": "#EFF5F6", "useTextCenter": true, "textSize": "fc-h6-text", "textColor": "#000000", "text": "\nKelebihan Kedua yang Bikin Beda\n" }, "uniqueId": "fc-block-20-n4pnojark", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-59-aem1hn65s", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "0", "paddingBottom": "10", "backgroundColor": "#EFF5F6", "useTextCenter": true, "textSize": "fc-content-text", "textColor": "#7A69F6", "text": "Kursus ini bukan sekadar belajar pakai tech stack dengan format [kode implementasi - penjelasan].\n" }, "uniqueId": "fc-block-19-746vxp5th", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-28-8ge3y361m", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "0", "paddingBottom": "30", "backgroundColor": "#EFF5F6", "useTextCenter": true, "textSize": "fc-h5-text", "textColor": "#0C151A", "text": "\nIni adalah kursus yang menggunakan metode [pembelajaran berbasis skenario].
\nKamu akan belajar tentang masalah dan
\nsolusi yang diberikan dari developer ahli secara bertahap.\n" }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-21-xjubuc96k", "isChecked": false }, { "id": "fc-block-27-hz2lrcqse", "layout": { "id": "201", "description": "중앙정렬 고정 사이즈 이미지", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useImageLeft", "type": "checkbox", "description": "use image center" }, { "name": "imageUrl", "type": "image", "description": "image url" }, { "name": "mobileImageUrl", "type": "image", "description": "mobile image url" }, { "name": "imageWidth", "type": "number", "description": "image width" }, { "name": "alt", "type": "text", "description": "이미지를 설명(대체)하는 대표 문구" }, { "name": "useNewTab", "type": "checkbox", "description": "" }, { "name": "link", "type": "text", "description": "link" } ], "values": { "backgroundColor": "#ffffff", "useImageLeft": false, "imageUrl": "", "mobileImageUrl": "", "imageWidth": 980, "alt": "", "useNewTab": true, "link": "" }, "template": "

\">\n

\n" }, "values": { "backgroundColor": "#EFF5F6", "useImageLeft": false, "imageUrl": "https://cdn.day1company.io/prod/uploads/202403/165147-199/sc7.png", "mobileImageUrl": "", "imageWidth": 980, "alt": "", "useNewTab": true, "link": "" }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-22-rob9g6zn2", "isChecked": false }, { "id": "fc-block-37-zbt2dmnz3", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "30", "paddingBottom": "40", "backgroundColor": "#EFF5F6", "useTextCenter": true, "textSize": "fc-h5-text", "textColor": "#0C151A", "text": "\nLangsung ikutan yuk!\n
\nAku bakal bimbing seperti sedang mentoring di kantor, disesuaikan tergantung kasusnya!\n" }, "uniqueId": "fc-block-18-egbwcmnjr", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-29-1halrcexq", "layout": { "id": "003", "description": "문단 구분 선", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "borderColor", "type": "text", "description": "border color" }, { "name": "borderSize", "type": "select", "description": "size", "options": [ "1", "2" ] } ], "values": { "backgroundColor": "#ffffff", "paddingTop": 10, "paddingBottom": 10, "borderColor": "#c8c8d2", "borderSize": "1" }, "template": "

\">\n

rem;padding-bottom: <%= paddingBottom/10 %>rem;\">\n

rem solid <%= borderColor %>;\">\n

\n" }, "values": { "backgroundColor": "#EFF5F6", "paddingTop": "0", "paddingBottom": "30", "borderColor": "#D8DFE0", "borderSize": "1" }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-23-7ioiopt8p", "isChecked": false }, { "id": "fc-block-17-1pwu75hrr", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "0", "paddingBottom": "10", "backgroundColor": "#EFF5F6", "useTextCenter": false, "textSize": "fc-h6-text", "textColor": "#8858FA", "text": "\nQuestion.\n" }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-24-ftgsb14nn", "isChecked": false }, { "id": "fc-block-18-hvlcjr28u", "layout": { "id": "102", "description": "2단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize1", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor1", "type": "text", "description": "text color" }, { "name": "text1", "type": "textarea", "description": "text" }, { "name": "textSize2", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor2", "type": "text", "description": "text color" }, { "name": "text2", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize1": "fc-h1-text", "textColor1": "#000000", "text1": "", "textSize2": "fc-h1-text", "textColor2": "#000000", "text2": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n <% if(text1) { %>\n

\" style=\"<% if(textColor1) { %>color: <%= textColor1 %><% } %>\">\n <%= text1 %>\n

\n <% } %>\n <% if(text2) { %>\n

\" style=\"<% if(textColor2) { %>color: <%= textColor2 %><% } %>\">\n <%= text2 %>\n

\n <% } %>\n

\n" }, "values": { "paddingTop": "0", "paddingBottom": "80", "backgroundColor": "#EFF5F6", "useTextCenter": false, "textSize1": "fc-h5-text", "textColor1": "#0C151A", "text1": "Apa sih alasan pakai
\npembelajaran berbasis skenario?", "textSize2": "fc-content-text", "textColor2": "#0C151A", "text2": "Pembelajaran berbasis skenario menawarkan cara praktis dan mendalam untuk memperoleh keterampilan dan pengetahuan baru.
\n Dengan terlibat dalam skenario realistis, peserta dapat lebih memahami bagaimana menerapkan apa yang mereka pelajari dalam situasi dunia real.
\n Metode ini juga mendorong pemikiran kritis dan pemecahan masalah, karena peserta harus menavigasi skenario, membuat keputusan yang memengaruhi outcome." }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-25-jgp8e9t6i", "isChecked": false }, { "id": "fc-block-33-tr3dtwzjg", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "80", "paddingBottom": "30", "backgroundColor": "#fff", "useTextCenter": false, "textSize": "fc-h5-text", "textColor": "#000000", "text": "\nKeunggulan dari kursus yang diajarkan Theo\n" }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-26-eaa9gwrmr", "isChecked": false }, { "id": "fc-block-36-ukzoce9pp", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "0", "paddingBottom": "10", "backgroundColor": "#fff", "useTextCenter": false, "textSize": "fc-h6-text", "textColor": "#000000", "text": "\nSiapa sih yang cocok buat ikutan kursus ini?\n" }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-27-zuinlm6te", "isChecked": false }, { "id": "fc-block-37-8poi3pgpu", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "0", "paddingBottom": "0", "backgroundColor": "#fff", "useTextCenter": false, "textSize": "fc-content-text", "textColor": "#000000", "text": "Kursus ini sangat cocok untuk siapa pun yang tertarik mendalami dunia software development, khususnya mereka yang tidak punya background programming tapi sangat bersemangat untuk bikin software. Selain itu, cocok juga untuk developer junior yang ingin memperkuat skill Javascript dan Frontend development, khususnya React dan Next.js." }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-28-hx8f4usa8", "isChecked": false }, { "id": "fc-block-35-1ojevpw1k", "layout": { "id": "003", "description": "문단 구분 선", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "borderColor", "type": "text", "description": "border color" }, { "name": "borderSize", "type": "select", "description": "size", "options": [ "1", "2" ] } ], "values": { "backgroundColor": "#ffffff", "paddingTop": 10, "paddingBottom": 10, "borderColor": "#c8c8d2", "borderSize": "1" }, "template": "

\">\n

rem;padding-bottom: <%= paddingBottom/10 %>rem;\">\n

rem solid <%= borderColor %>;\">\n

\n" }, "values": { "backgroundColor": "#ffffff", "paddingTop": "30", "paddingBottom": "30", "borderColor": "#E0E0E0", "borderSize": "1" }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-29-odwwb1gb1", "isChecked": false }, { "id": "fc-block-34-5yv1e8ob8", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "0", "paddingBottom": "10", "backgroundColor": "#fff", "useTextCenter": false, "textSize": "fc-h6-text", "textColor": "#000000", "text": "\nPengembangan karir/keahlian apa sih yang bisa didapatkan setelah ikut kursus ini?\n" }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-30-0825cguan", "isChecked": false }, { "id": "fc-block-32-cknia5lbg", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "0", "paddingBottom": "80", "backgroundColor": "#fff", "useTextCenter": false, "textSize": "fc-content-text", "textColor": "#000000", "text": "Kursus ini akan meningkatkan kemampuan Frontend, khususnya ekosistem React, yang akan membantu untuk mendapatkan kerja di perusahaan IT dan proyek-proyek yang memakai teknologi ini. React adalah framework yang sangat populer. Dengan menguasainya, peluang untuk dapat pekerjaan semakin besar." }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-31-n2hzkl87z", "isChecked": false }, { "id": "fc-block-43-g6dg03j3y", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "80", "paddingBottom": "0", "backgroundColor": "#EFF5F6", "useTextCenter": true, "textSize": "fc-h6-text", "textColor": "#000000", "text": "\nKelebihan Ketiga yang Bikin Beda\n" }, "uniqueId": "fc-block-32-0t31fsioi", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-44-knnan978d", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "0", "paddingBottom": "30", "backgroundColor": "#EFF5F6", "useTextCenter": true, "textSize": "fc-h5-text", "textColor": "#0C151A", "text": "\nKomunitas Discord khusus peserta buat mastiin kamu bisa selalu nanya soal apa pun
\nyang pengen kamu tahu selama belajar.\n" }, "uniqueId": "fc-block-33-arkmwu4yk", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-42-sp9bcbgzm", "layout": { "id": "201", "description": "중앙정렬 고정 사이즈 이미지", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useImageLeft", "type": "checkbox", "description": "use image center" }, { "name": "imageUrl", "type": "image", "description": "image url" }, { "name": "mobileImageUrl", "type": "image", "description": "mobile image url" }, { "name": "imageWidth", "type": "number", "description": "image width" }, { "name": "alt", "type": "text", "description": "이미지를 설명(대체)하는 대표 문구" }, { "name": "useNewTab", "type": "checkbox", "description": "" }, { "name": "link", "type": "text", "description": "link" } ], "values": { "backgroundColor": "#ffffff", "useImageLeft": false, "imageUrl": "", "mobileImageUrl": "", "imageWidth": 980, "alt": "", "useNewTab": true, "link": "" }, "template": "

\">\n

\n" }, "values": { "backgroundColor": "#EFF5F6", "useImageLeft": false, "imageUrl": "https://cdn.day1company.io/prod/uploads/202403/180106-199/sc9-discord.png", "mobileImageUrl": "", "imageWidth": "670", "alt": "", "useNewTab": true, "link": "" }, "uniqueId": "fc-block-34-hbzrcj8ar", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-41-3gn6725ar", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "30", "paddingBottom": 10, "backgroundColor": "#EFF5F6", "useTextCenter": true, "textSize": "fc-content-text", "textColor": "#0C151A", "text": "\nKursus ini dilengkapi dengan Tanya Jawab (Q&A) komunitas yang dikelola langsung pembimbing dan developer
\nberpengalaman. Kamu bisa langsung dapat jawaban, sharing pengetahuan, dan masalah yang dihadapi.\n" }, "uniqueId": "fc-block-35-9pp7nn207", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-25-mwu0c7kid", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "0", "paddingBottom": "80", "backgroundColor": "#EFF5F6", "useTextCenter": true, "textSize": "fc-content-text", "textColor": "#676F72", "text": "\n* Kamu bisa gabung komunitas ini lewat link yang diposting di pengumuman kursus online
\n* Sesi Tanya Jawab (Q&A) akan berlangsung dari 19 April sampai 31 Juli 2024\n" }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-36-cyifl9oo2", "isChecked": false }, { "id": "fc-block-23-ytq4o25l3", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "80", "paddingBottom": "0", "backgroundColor": "#0C151A", "useTextCenter": true, "textSize": "fc-h6-text", "textColor": "#000000", "text": "\nKelebihan Ketiga yang Bikin Beda\n" }, "uniqueId": "fc-block-17-2fg3u89e5", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-40-5zokhw6z6", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "0", "paddingBottom": "10", "backgroundColor": "#0C151A", "useTextCenter": true, "textSize": "fc-h5-text", "textColor": "#fff", "text": "\nAkademi Frontend-nya Theo, 
\nbelajar semuanya tentang frontend sekaligus\n" }, "uniqueId": "fc-block-37-pnhz8q1xg", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-26-a9ls9asja", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "0", "paddingBottom": "30", "backgroundColor": "#0C151A", "useTextCenter": true, "textSize": "fc-content-text", "textColor": "#CED0D1", "text": "Dalam 15 jam, kuasai skill yang bisa langsung kamu terapkan di dunia nyata,
\nmulai dari implementasi sampai growth, untuk produk berkualitas tinggi!" }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-38-295nfars4", "isChecked": false }, { "id": "fc-block-46-p7lxglqsn", "layout": { "id": "211", "description": "2단/3단 캐러셀", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "숫자 입력" }, { "name": "paddingBottom", "type": "number", "description": "숫자 입력" }, { "name": "columnCount", "type": "select", "description": "default - 3columns", "options": [ "3", "2" ] }, { "name": "backgroundColor", "type": "text", "description": "배경 색상" }, { "name": "colorTheme", "type": "select", "description": "네가지 테마중 하나를 선택할 수 있습니다.
light theme_red - 밝은 배경에 사용합니다 (버튼포인트)
dark theme_red - 어두운 배경에 사용합니다 (버튼포인트)
light theme_mono - 밝은 배경에 사용합니다
dark theme_mono - 어두운 배경에 사용합니다", "options": [ "theme-light-red", "theme-dark-red", "theme-light-mono", "theme-dark-mono" ] }, { "name": "text1Size", "type": "select", "description": "h5(20px), h6(16px) contents(14px)", "options": [ "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "text2Size", "type": "select", "description": "h5(20px), h6(16px) contents(14px)", "options": [ "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "cards", "type": "list", "description": "추가/삭제를 이용하여 원하는 만큼 카드 리스트를 구현 할 수 있습니다.", "maxLength": 20, "params": [ { "name": "imageUrl", "type": "image", "description": "파일 업로드" }, { "name": "text1", "type": "text", "description": "자유 입력" }, { "name": "text2", "type": "text", "description": "자유 입력" } ] } ], "values": { "paddingTop": 40, "paddingBottom": 40, "columnCount": "3", "backgroundColor": "#ffffff", "colorTheme": "theme-light-red", "text1Size": "fc-h5-text", "text2Size": "fc-h6-text", "cards": [ { "imageUrl": "", "text1": "", "text2": "" }, { "imageUrl": "", "text1": "", "text2": "" }, { "imageUrl": "", "text1": "", "text2": "" } ] }, "template": "

rem;\n padding-bottom: <%= paddingBottom/10 %>rem;\n background-color: <%= backgroundColor || '#ffffff' %>\">\n

\">\n

\n
\">\n <% if (imageUrl) { %>\n \" alt=\"\" />\n <% } %>\n
\n <% if (text1) { %>\n
\"><%= text1 %>
\n <% } %>\n <% if (text2) { %>\n
\"><%= text2 %>
\n <% } %>\n

\n" }, "values": { "paddingTop": "0", "paddingBottom": "80", "columnCount": "3", "backgroundColor": "#0C151A", "colorTheme": "theme-dark-mono", "text1Size": "fc-h5-text", "text2Size": "fc-h6-text", "cards": [ { "imageUrl": "https://cdn.day1company.io/prod/uploads/202403/170206-199/sc10-1.png", "text1": "", "text2": "" }, { "imageUrl": "https://cdn.day1company.io/prod/uploads/202403/170209-199/sc10-2.png", "text1": "", "text2": "" }, { "imageUrl": "https://cdn.day1company.io/prod/uploads/202403/170212-199/sc10-3.png", "text1": "", "text2": "" } ] }, "uniqueId": "fc-block-39-u7ssk0gyz", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-3-a8qn17c39", "layout": { "id": "804", "description": "앵커탭영역", "icon": "\n", "params": [ { "name": "id", "label": "id", "type": "text", "description": "연결 될 탭 영역에 대한 id 값" } ], "values": { "id": "" }, "template": "\n" }, "values": { "id": "tab5" }, "uniqueId": "fc-block-2-70341c5me", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-7-cg5g1chrx", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "80", "paddingBottom": "10", "backgroundColor": "#F2F2F2", "useTextCenter": false, "textSize": "fc-h4-text", "textColor": "#000000", "text": "\nKurikulum Lengkap\n" }, "uniqueId": "fc-block-1-hs7w7ewha", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-8-grtr2xk06", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "0", "paddingBottom": "30", "backgroundColor": "#F2F2F2", "useTextCenter": false, "textSize": "fc-content-text", "textColor": "#3c3c3c", "text": "Instruktur kami berasal dari perusahaan IT ternama yang dapat membantu kamu update
\ndengan tren terbaru bursa kerja untuk Frontend." }, "uniqueId": "fc-block-2-miolbm6f1", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-5-gq3wg65eo", "layout": { "id": "002", "description": "컴포넌트 라벨", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "labelText", "type": "text", "description": "label text" }, { "name": "layoutType", "type": "select", "description": "type", "options": [ "fc-label-type1", "fc-label-type2" ] }, { "name": "labelColor", "type": "text", "description": "label color" } ], "values": { "backgroundColor": "#ffffff", "paddingTop": 10, "paddingBottom": 10, "labelText": "", "layoutType": "fc-label-type1", "labelColor": "#000000" }, "template": "

\">\n

rem; padding-bottom: <%= paddingBottom/10 %>rem;\">\n

\" style=\"border: 2px solid <%= labelColor || '#000000' %>; color: <%= labelColor || '#000000' %>\">\n <%= labelText %>\n

\n" }, "values": { "backgroundColor": "#F2F2F2", "paddingTop": "0", "paddingBottom": "20", "labelText": "Bagian 1. React Fundamentals", "layoutType": "fc-label-type2", "labelColor": "#000000" }, "uniqueId": "fc-block-3-zpsn5ri63", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-2-vb5zjelh1", "layout": { "id": "501", "description": "2단 아코디언 리스트", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "collapsed", "type": "checkbox", "description": "collapsed" }, { "name": "cardBackgroundColor", "type": "text", "description": "card background color" }, { "name": "borderColor", "type": "text", "description": "border color" }, { "name": "arrowBtnColor", "type": "text", "description": "arrow btn color" }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "title1", "type": "text", "description": "title1" }, { "name": "content1", "type": "textarea", "description": "content1" }, { "name": "imageUrl1", "type": "image", "description": "imageUrl1" }, { "name": "title2", "type": "text", "description": "title2" }, { "name": "content2", "type": "textarea", "description": "content2" }, { "name": "imageUrl2", "type": "image", "description": "imageUrl2" } ], "values": { "backgroundColor": "", "collapsed": false, "cardBackgroundColor": "#ffffff", "borderColor": "#e6e8eb", "arrowBtnColor": "#6e6e73", "textColor": "#000000", "title1": "", "content1": "", "imageUrl1": "", "title2": "", "content2": "", "imageUrl2": "" }, "template": "

\">\n

\n <% if (title1 || content1 || imageUrl1) { %>\n

; border-color: <%= borderColor || '#e6e8eb' %>\">\n \n checked<% } %>>\n

\">\n <%= title1 %>\n \n \n

;color: <%= textColor || '#000000' %>\">\n <%= content1 %>\n <% if (imageUrl1) { %>\n \" alt=\"\" loading=\"lazy\">\n <% } %>\n

\n \n

\n <% } %>\n <% if (title2 || content2 || imageUrl2) { %>\n

; border-color: <%= borderColor || '#e6e8eb' %>\">\n \n checked<% } %>>\n

\">\n <%= title2 %>\n \n \n

; color: <%= textColor || '#000000' %>\">\n <%= content2 %>\n <% if (imageUrl2) { %>\n \" alt=\"\" loading=\"lazy\">\n <% } %>\n

\n \n

\n <% } %>\n

\n" }, "values": { "backgroundColor": "#F2F2F2", "collapsed": false, "cardBackgroundColor": "#ffffff", "borderColor": "#e6e8eb", "arrowBtnColor": "#6e6e73", "textColor": "#000000", "title1": "Bab 1. Intro to React", "content1": "1-1. What is React?
\t\n1-2. Environment Prerequisite
\t\n1-3. Creating a React app with vite
\t\n1-4. Understanding a React project's file structure
\t\n1-5. Setting up tailwind
\t", "imageUrl1": "", "title2": "Bab 2. Let's start our online market.
(Components and Props)", "content2": "2-1. [New Concept] Components
\t\n2-2. [Challenge] Layouting our home page. Header, body, footer
\t\n2-3. Adding a simple footer with a contact me button
\t\n2-4. Setting up shadcn
\t\n2-5. Designing our header navbar
\t\n2-6. Designing our product card and grid layout
\t\n2-7. [New Concept] Props
\t\n2-8. [Challenge] Let's add our product!
\t\n2-9. [New Concept] Children props
\t\n2-10. [New Concept] Array of JSX?
\t\n2-11. [Challenge] Even more products?
\t", "imageUrl2": "" }, "uniqueId": "fc-block-5-7dehmpbcy", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-2-w7ob6hgzd", "layout": { "id": "001", "description": "레이아웃 간격", "icon": "\n", "params": [ { "name": "spacing", "type": "number", "description": "spacing" }, { "name": "backgroundColor", "type": "text", "description": "background color" } ], "values": { "spacing": 10, "backgroundColor": "#ffffff" }, "template": "

rem;\n padding-bottom: <%= spacing/10/2 %>rem;\n background-color: <%= backgroundColor || '#ffffff' %>\">\n

\n" }, "values": { "spacing": "20", "backgroundColor": "#F2F2F2" }, "uniqueId": "fc-block-1-4k97hmvnn", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-3-pdm1hnk9t", "layout": { "id": "501", "description": "2단 아코디언 리스트", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "collapsed", "type": "checkbox", "description": "collapsed" }, { "name": "cardBackgroundColor", "type": "text", "description": "card background color" }, { "name": "borderColor", "type": "text", "description": "border color" }, { "name": "arrowBtnColor", "type": "text", "description": "arrow btn color" }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "title1", "type": "text", "description": "title1" }, { "name": "content1", "type": "textarea", "description": "content1" }, { "name": "imageUrl1", "type": "image", "description": "imageUrl1" }, { "name": "title2", "type": "text", "description": "title2" }, { "name": "content2", "type": "textarea", "description": "content2" }, { "name": "imageUrl2", "type": "image", "description": "imageUrl2" } ], "values": { "backgroundColor": "", "collapsed": false, "cardBackgroundColor": "#ffffff", "borderColor": "#e6e8eb", "arrowBtnColor": "#6e6e73", "textColor": "#000000", "title1": "", "content1": "", "imageUrl1": "", "title2": "", "content2": "", "imageUrl2": "" }, "template": "

\">\n

\n <% if (title1 || content1 || imageUrl1) { %>\n

; border-color: <%= borderColor || '#e6e8eb' %>\">\n \n checked<% } %>>\n

\">\n <%= title1 %>\n \n \n

;color: <%= textColor || '#000000' %>\">\n <%= content1 %>\n <% if (imageUrl1) { %>\n \" alt=\"\" loading=\"lazy\">\n <% } %>\n

\n \n

\n <% } %>\n <% if (title2 || content2 || imageUrl2) { %>\n

; border-color: <%= borderColor || '#e6e8eb' %>\">\n \n checked<% } %>>\n

\">\n <%= title2 %>\n \n \n

; color: <%= textColor || '#000000' %>\">\n <%= content2 %>\n <% if (imageUrl2) { %>\n \" alt=\"\" loading=\"lazy\">\n <% } %>\n

\n \n

\n <% } %>\n

\n" }, "values": { "backgroundColor": "#F2F2F2", "collapsed": false, "cardBackgroundColor": "#ffffff", "borderColor": "#e6e8eb", "arrowBtnColor": "#6e6e73", "textColor": "#000000", "title1": "Bab 3. Creating a more dynamic UI (State)", "content1": "3-1. New Feature! Add to cart button with quantity
\t\n3-2. Triggering a function through button clicks
\t\n3-3. Why not use normal variables?
\t\n3-4. [New Concept] State
\t\n3-5. [Challenge] Fixing the quantity problem
\t\n3-6. Behind the scenes of states and rerenders
\t\n3-7. Product out of stock. Disable the cart button!
\t", "imageUrl1": "", "title2": "", "content2": "", "imageUrl2": "" }, "uniqueId": "fc-block-6-dscqtsm3u", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-3-eewyqsi69", "layout": { "id": "002", "description": "컴포넌트 라벨", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "labelText", "type": "text", "description": "label text" }, { "name": "layoutType", "type": "select", "description": "type", "options": [ "fc-label-type1", "fc-label-type2" ] }, { "name": "labelColor", "type": "text", "description": "label color" } ], "values": { "backgroundColor": "#ffffff", "paddingTop": 10, "paddingBottom": 10, "labelText": "", "layoutType": "fc-label-type1", "labelColor": "#000000" }, "template": "

\">\n

rem; padding-bottom: <%= paddingBottom/10 %>rem;\">\n

\" style=\"border: 2px solid <%= labelColor || '#000000' %>; color: <%= labelColor || '#000000' %>\">\n <%= labelText %>\n

\n" }, "values": { "backgroundColor": "#F2F2F2", "paddingTop": "40", "paddingBottom": "20", "labelText": "Bagian 2. Enhancing UI Interactions", "layoutType": "fc-label-type2", "labelColor": "#000000" }, "uniqueId": "fc-block-2-cqrtcnqno", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-52-e2bwauqov", "layout": { "id": "501", "description": "2단 아코디언 리스트", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "collapsed", "type": "checkbox", "description": "collapsed" }, { "name": "cardBackgroundColor", "type": "text", "description": "card background color" }, { "name": "borderColor", "type": "text", "description": "border color" }, { "name": "arrowBtnColor", "type": "text", "description": "arrow btn color" }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "title1", "type": "text", "description": "title1" }, { "name": "content1", "type": "textarea", "description": "content1" }, { "name": "imageUrl1", "type": "image", "description": "imageUrl1" }, { "name": "title2", "type": "text", "description": "title2" }, { "name": "content2", "type": "textarea", "description": "content2" }, { "name": "imageUrl2", "type": "image", "description": "imageUrl2" } ], "values": { "backgroundColor": "", "collapsed": false, "cardBackgroundColor": "#ffffff", "borderColor": "#e6e8eb", "arrowBtnColor": "#6e6e73", "textColor": "#000000", "title1": "", "content1": "", "imageUrl1": "", "title2": "", "content2": "", "imageUrl2": "" }, "template": "

\">\n

\n <% if (title1 || content1 || imageUrl1) { %>\n

; border-color: <%= borderColor || '#e6e8eb' %>\">\n \n checked<% } %>>\n

\">\n <%= title1 %>\n \n \n

;color: <%= textColor || '#000000' %>\">\n <%= content1 %>\n <% if (imageUrl1) { %>\n \" alt=\"\" loading=\"lazy\">\n <% } %>\n

\n \n

\n <% } %>\n <% if (title2 || content2 || imageUrl2) { %>\n

; border-color: <%= borderColor || '#e6e8eb' %>\">\n \n checked<% } %>>\n

\">\n <%= title2 %>\n \n \n

; color: <%= textColor || '#000000' %>\">\n <%= content2 %>\n <% if (imageUrl2) { %>\n \" alt=\"\" loading=\"lazy\">\n <% } %>\n

\n \n

\n <% } %>\n

\n" }, "values": { "backgroundColor": "#F2F2F2", "collapsed": false, "cardBackgroundColor": "#ffffff", "borderColor": "#e6e8eb", "arrowBtnColor": "#6e6e73", "textColor": "#000000", "title1": "Bab 4. Handling Multiple \"pages\" (Routing basics)", "content1": "4-1. Setting up react-router-dom
\t\n4-2. Setting our routes and navigating through pages
\t\n4-3. Do we actually have multiple HTML files now? Nope!
\t\n4-4. Oops! Can't find the page you are looking for
\t", "imageUrl1": "", "title2": "Bab 5. Receiving user input (Form handling)", "content2": "5-1. Creating a login page
\t\n5-2. Storing input in state
\t\n5-3. Submitting forms. But there's a problem!
\t\n5-4. Using a better alternative (react-hook-form)
\t\n5-5. Validating forms
\t", "imageUrl2": "" }, "uniqueId": "fc-block-16-6n0mcasxu", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-8-8qelokbu8", "layout": { "id": "002", "description": "컴포넌트 라벨", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "labelText", "type": "text", "description": "label text" }, { "name": "layoutType", "type": "select", "description": "type", "options": [ "fc-label-type1", "fc-label-type2" ] }, { "name": "labelColor", "type": "text", "description": "label color" } ], "values": { "backgroundColor": "#ffffff", "paddingTop": 10, "paddingBottom": 10, "labelText": "", "layoutType": "fc-label-type1", "labelColor": "#000000" }, "template": "

\">\n

rem; padding-bottom: <%= paddingBottom/10 %>rem;\">\n

\" style=\"border: 2px solid <%= labelColor || '#000000' %>; color: <%= labelColor || '#000000' %>\">\n <%= labelText %>\n

\n" }, "values": { "backgroundColor": "#F2F2F2", "paddingTop": "40", "paddingBottom": "20", "labelText": "Bagian 3. Data Handling", "layoutType": "fc-label-type2", "labelColor": "#000000" }, "uniqueId": "fc-block-3-syh1hxj49", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-11-gezs5y2d7", "layout": { "id": "501", "description": "2단 아코디언 리스트", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "collapsed", "type": "checkbox", "description": "collapsed" }, { "name": "cardBackgroundColor", "type": "text", "description": "card background color" }, { "name": "borderColor", "type": "text", "description": "border color" }, { "name": "arrowBtnColor", "type": "text", "description": "arrow btn color" }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "title1", "type": "text", "description": "title1" }, { "name": "content1", "type": "textarea", "description": "content1" }, { "name": "imageUrl1", "type": "image", "description": "imageUrl1" }, { "name": "title2", "type": "text", "description": "title2" }, { "name": "content2", "type": "textarea", "description": "content2" }, { "name": "imageUrl2", "type": "image", "description": "imageUrl2" } ], "values": { "backgroundColor": "", "collapsed": false, "cardBackgroundColor": "#ffffff", "borderColor": "#e6e8eb", "arrowBtnColor": "#6e6e73", "textColor": "#000000", "title1": "", "content1": "", "imageUrl1": "", "title2": "", "content2": "", "imageUrl2": "" }, "template": "

\">\n

\n <% if (title1 || content1 || imageUrl1) { %>\n

; border-color: <%= borderColor || '#e6e8eb' %>\">\n \n checked<% } %>>\n

\">\n <%= title1 %>\n \n \n

;color: <%= textColor || '#000000' %>\">\n <%= content1 %>\n <% if (imageUrl1) { %>\n \" alt=\"\" loading=\"lazy\">\n <% } %>\n

\n \n

\n <% } %>\n <% if (title2 || content2 || imageUrl2) { %>\n

; border-color: <%= borderColor || '#e6e8eb' %>\">\n \n checked<% } %>>\n

\">\n <%= title2 %>\n \n \n

; color: <%= textColor || '#000000' %>\">\n <%= content2 %>\n <% if (imageUrl2) { %>\n \" alt=\"\" loading=\"lazy\">\n <% } %>\n

\n \n

\n <% } %>\n

\n" }, "values": { "backgroundColor": "#F2F2F2", "collapsed": false, "cardBackgroundColor": "#ffffff", "borderColor": "#e6e8eb", "arrowBtnColor": "#6e6e73", "textColor": "#000000", "title1": "Bob 6. Things are getting more challenging
(Data fetching and lifecycle methods)", "content1": "6-1. Setting up a mock API and database
\t\n6-2. [New Concept] Fetching data from an API using Axios
\t\n6-3. [Challenge] Replacing static data using data from API
\t\n6-4. [New Concept] Introducing React Component Lifecycles
\t\n6-5. [New Concept] Using lifecycle methods
\t\n6-6. [Challenge] Automatic data fetching
\t", "imageUrl1": "", "title2": "Bob 7. Exploring data fetching techniques", "content2": "7-1. Creating a product detail page
\t\n7-2. [New Concept] Using route params in react-router-dom
\t\n7-3. [Challenge] Fetching product data using route params
\t\n7-4. Don't forget loading states
\t", "imageUrl2": "" }, "uniqueId": "fc-block-4-cp6tg3dj6", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-12-brhwz1hnc", "layout": { "id": "001", "description": "레이아웃 간격", "icon": "\n", "params": [ { "name": "spacing", "type": "number", "description": "spacing" }, { "name": "backgroundColor", "type": "text", "description": "background color" } ], "values": { "spacing": 10, "backgroundColor": "#ffffff" }, "template": "

rem;\n padding-bottom: <%= spacing/10/2 %>rem;\n background-color: <%= backgroundColor || '#ffffff' %>\">\n

\n" }, "values": { "spacing": "20", "backgroundColor": "#F2F2F2" }, "uniqueId": "fc-block-5-ndw79d1yd", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-10-jmmtjyhr0", "layout": { "id": "501", "description": "2단 아코디언 리스트", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "collapsed", "type": "checkbox", "description": "collapsed" }, { "name": "cardBackgroundColor", "type": "text", "description": "card background color" }, { "name": "borderColor", "type": "text", "description": "border color" }, { "name": "arrowBtnColor", "type": "text", "description": "arrow btn color" }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "title1", "type": "text", "description": "title1" }, { "name": "content1", "type": "textarea", "description": "content1" }, { "name": "imageUrl1", "type": "image", "description": "imageUrl1" }, { "name": "title2", "type": "text", "description": "title2" }, { "name": "content2", "type": "textarea", "description": "content2" }, { "name": "imageUrl2", "type": "image", "description": "imageUrl2" } ], "values": { "backgroundColor": "", "collapsed": false, "cardBackgroundColor": "#ffffff", "borderColor": "#e6e8eb", "arrowBtnColor": "#6e6e73", "textColor": "#000000", "title1": "", "content1": "", "imageUrl1": "", "title2": "", "content2": "", "imageUrl2": "" }, "template": "

\">\n

\n <% if (title1 || content1 || imageUrl1) { %>\n

; border-color: <%= borderColor || '#e6e8eb' %>\">\n \n checked<% } %>>\n

\">\n <%= title1 %>\n \n \n

;color: <%= textColor || '#000000' %>\">\n <%= content1 %>\n <% if (imageUrl1) { %>\n \" alt=\"\" loading=\"lazy\">\n <% } %>\n

\n \n

\n <% } %>\n <% if (title2 || content2 || imageUrl2) { %>\n

; border-color: <%= borderColor || '#e6e8eb' %>\">\n \n checked<% } %>>\n

\">\n <%= title2 %>\n \n \n

; color: <%= textColor || '#000000' %>\">\n <%= content2 %>\n <% if (imageUrl2) { %>\n \" alt=\"\" loading=\"lazy\">\n <% } %>\n

\n \n

\n <% } %>\n

\n" }, "values": { "backgroundColor": "#F2F2F2", "collapsed": false, "cardBackgroundColor": "#ffffff", "borderColor": "#e6e8eb", "arrowBtnColor": "#6e6e73", "textColor": "#000000", "title1": "Bob 8. Let's manage our products", "content1": "8-1. Layouting our admin dashboard
\t\n8-2. Adding a product table
\t\n8-3. Adding pagination (part 1)
\t\n8-4. Adding pagination (part 2)
\t\n8-5. Search feature too
\t\n8-6. Designing our create product page
\t\n8-7. Storing our data in the database!
\t\n8-8. Reusing our product form for edit page
\t\n8-9. Completing our edit product feature (Part 1)
\t\n8-10. Completing our edit product feature (Part 2)
\t\n8-11. Making a simple delete product feature
\t\n8-12. Let's make it more interesting. Multi select?
\t\n8-13. Completing our delete feature with a few limitations
\t", "imageUrl1": "", "title2": "", "content2": "", "imageUrl2": "" }, "uniqueId": "fc-block-6-lgyoc9v8v", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-7-828e5ljna", "layout": { "id": "002", "description": "컴포넌트 라벨", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "labelText", "type": "text", "description": "label text" }, { "name": "layoutType", "type": "select", "description": "type", "options": [ "fc-label-type1", "fc-label-type2" ] }, { "name": "labelColor", "type": "text", "description": "label color" } ], "values": { "backgroundColor": "#ffffff", "paddingTop": 10, "paddingBottom": 10, "labelText": "", "layoutType": "fc-label-type1", "labelColor": "#000000" }, "template": "

\">\n

rem; padding-bottom: <%= paddingBottom/10 %>rem;\">\n

\" style=\"border: 2px solid <%= labelColor || '#000000' %>; color: <%= labelColor || '#000000' %>\">\n <%= labelText %>\n

\n" }, "values": { "backgroundColor": "#F2F2F2", "paddingTop": "40", "paddingBottom": "20", "labelText": "Bagian 4. State Management", "layoutType": "fc-label-type2", "labelColor": "#000000" }, "uniqueId": "fc-block-7-ln7fpvnmm", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-13-r1wirgwou", "layout": { "id": "501", "description": "2단 아코디언 리스트", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "collapsed", "type": "checkbox", "description": "collapsed" }, { "name": "cardBackgroundColor", "type": "text", "description": "card background color" }, { "name": "borderColor", "type": "text", "description": "border color" }, { "name": "arrowBtnColor", "type": "text", "description": "arrow btn color" }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "title1", "type": "text", "description": "title1" }, { "name": "content1", "type": "textarea", "description": "content1" }, { "name": "imageUrl1", "type": "image", "description": "imageUrl1" }, { "name": "title2", "type": "text", "description": "title2" }, { "name": "content2", "type": "textarea", "description": "content2" }, { "name": "imageUrl2", "type": "image", "description": "imageUrl2" } ], "values": { "backgroundColor": "", "collapsed": false, "cardBackgroundColor": "#ffffff", "borderColor": "#e6e8eb", "arrowBtnColor": "#6e6e73", "textColor": "#000000", "title1": "", "content1": "", "imageUrl1": "", "title2": "", "content2": "", "imageUrl2": "" }, "template": "

\">\n

\n <% if (title1 || content1 || imageUrl1) { %>\n

; border-color: <%= borderColor || '#e6e8eb' %>\">\n \n checked<% } %>>\n

\">\n <%= title1 %>\n \n \n

;color: <%= textColor || '#000000' %>\">\n <%= content1 %>\n <% if (imageUrl1) { %>\n \" alt=\"\" loading=\"lazy\">\n <% } %>\n

\n \n

\n <% } %>\n <% if (title2 || content2 || imageUrl2) { %>\n

; border-color: <%= borderColor || '#e6e8eb' %>\">\n \n checked<% } %>>\n

\">\n <%= title2 %>\n \n \n

; color: <%= textColor || '#000000' %>\">\n <%= content2 %>\n <% if (imageUrl2) { %>\n \" alt=\"\" loading=\"lazy\">\n <% } %>\n

\n \n

\n <% } %>\n

\n" }, "values": { "backgroundColor": "#F2F2F2", "collapsed": false, "cardBackgroundColor": "#ffffff", "borderColor": "#e6e8eb", "arrowBtnColor": "#6e6e73", "textColor": "#000000", "title1": "Bab 09. Setting up a global state manager: Redux", "content1": "9-1. What is global state? Why do we need it?
\t\n9-2. How will Redux work?
\t\n9-3. Setting up Redux in our React app
\t\n9-4. [Core Concept] Fetching data from the Redux store
\t\n9-5. [Core Concept] Updating data from the Redux store
\t", "imageUrl1": "", "title2": "Bab 10. Adding authentication", "content2": "10-1. Implementing user registration
\t\n10-2. Implementing login
\t\n10-3. Storing our user data in Redux
\t\n10-4. Persisting our auth data through localStorage
\t\n10-5. Don't forget to log out
\t\n10-6. Protecting specific pages (guests only)
\t\n10-7. Protecting specific pages (signed in users only)
\t\n10-8. Role based authorization: protecting admin page
\t\n10-9. Cleaning up our hydration function (custom hooks)
\t", "imageUrl2": "" }, "uniqueId": "fc-block-8-cibpiu62x", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-6-k8451gud7", "layout": { "id": "002", "description": "컴포넌트 라벨", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "labelText", "type": "text", "description": "label text" }, { "name": "layoutType", "type": "select", "description": "type", "options": [ "fc-label-type1", "fc-label-type2" ] }, { "name": "labelColor", "type": "text", "description": "label color" } ], "values": { "backgroundColor": "#ffffff", "paddingTop": 10, "paddingBottom": 10, "labelText": "", "layoutType": "fc-label-type1", "labelColor": "#000000" }, "template": "

\">\n

rem; padding-bottom: <%= paddingBottom/10 %>rem;\">\n

\" style=\"border: 2px solid <%= labelColor || '#000000' %>; color: <%= labelColor || '#000000' %>\">\n <%= labelText %>\n

\n" }, "values": { "backgroundColor": "#F2F2F2", "paddingTop": "40", "paddingBottom": "20", "labelText": "Bagian 5. Building a Shopping App", "layoutType": "fc-label-type2", "labelColor": "#000000" }, "uniqueId": "fc-block-9-hbo9zkg0z", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-16-531svawru", "layout": { "id": "501", "description": "2단 아코디언 리스트", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "collapsed", "type": "checkbox", "description": "collapsed" }, { "name": "cardBackgroundColor", "type": "text", "description": "card background color" }, { "name": "borderColor", "type": "text", "description": "border color" }, { "name": "arrowBtnColor", "type": "text", "description": "arrow btn color" }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "title1", "type": "text", "description": "title1" }, { "name": "content1", "type": "textarea", "description": "content1" }, { "name": "imageUrl1", "type": "image", "description": "imageUrl1" }, { "name": "title2", "type": "text", "description": "title2" }, { "name": "content2", "type": "textarea", "description": "content2" }, { "name": "imageUrl2", "type": "image", "description": "imageUrl2" } ], "values": { "backgroundColor": "", "collapsed": false, "cardBackgroundColor": "#ffffff", "borderColor": "#e6e8eb", "arrowBtnColor": "#6e6e73", "textColor": "#000000", "title1": "", "content1": "", "imageUrl1": "", "title2": "", "content2": "", "imageUrl2": "" }, "template": "

\">\n

\n <% if (title1 || content1 || imageUrl1) { %>\n

; border-color: <%= borderColor || '#e6e8eb' %>\">\n \n checked<% } %>>\n

\">\n <%= title1 %>\n \n \n

;color: <%= textColor || '#000000' %>\">\n <%= content1 %>\n <% if (imageUrl1) { %>\n \" alt=\"\" loading=\"lazy\">\n <% } %>\n

\n \n

\n <% } %>\n <% if (title2 || content2 || imageUrl2) { %>\n

; border-color: <%= borderColor || '#e6e8eb' %>\">\n \n checked<% } %>>\n

\">\n <%= title2 %>\n \n \n

; color: <%= textColor || '#000000' %>\">\n <%= content2 %>\n <% if (imageUrl2) { %>\n \" alt=\"\" loading=\"lazy\">\n <% } %>\n

\n \n

\n <% } %>\n

\n" }, "values": { "backgroundColor": "#F2F2F2", "collapsed": false, "cardBackgroundColor": "#ffffff", "borderColor": "#e6e8eb", "arrowBtnColor": "#6e6e73", "textColor": "#000000", "title1": "Bab 11. Let's start shopping!", "content1": "11-1. Preparing our cart
\t\n11-2. Adding items to our cart.
\t\n11-3. Handling multiple items of the same product
\t\n11-4. Storing our cart globally
\t\n11-5. Deleting cart items
\t\n11-6. Handling quantity changes in our cart
\t\n11-7. Designing our checkout card
\t\n11-8. Simulating a checkout feature
\t", "imageUrl1": "", "title2": "Bab 12. We got a whole lot of history!", "content2": "12-1. Designing our transaction history page
\t\n12-2. Using our actual data
\t\n12-3. Designing our transaction history detail page
\t\n12-4. Fetching real history detail data
\t", "imageUrl2": "" }, "uniqueId": "fc-block-10-ywgg653ne", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-4-0kvkrlgpr", "layout": { "id": "002", "description": "컴포넌트 라벨", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "labelText", "type": "text", "description": "label text" }, { "name": "layoutType", "type": "select", "description": "type", "options": [ "fc-label-type1", "fc-label-type2" ] }, { "name": "labelColor", "type": "text", "description": "label color" } ], "values": { "backgroundColor": "#ffffff", "paddingTop": 10, "paddingBottom": 10, "labelText": "", "layoutType": "fc-label-type1", "labelColor": "#000000" }, "template": "

\">\n

rem; padding-bottom: <%= paddingBottom/10 %>rem;\">\n

\" style=\"border: 2px solid <%= labelColor || '#000000' %>; color: <%= labelColor || '#000000' %>\">\n <%= labelText %>\n

\n" }, "values": { "backgroundColor": "#F2F2F2", "paddingTop": "40", "paddingBottom": "20", "labelText": "Bagian 6. Next Steps", "layoutType": "fc-label-type2", "labelColor": "#000000" }, "uniqueId": "fc-block-11-e1oeqmkqa", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-17-1f3piqk7j", "layout": { "id": "501", "description": "2단 아코디언 리스트", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "collapsed", "type": "checkbox", "description": "collapsed" }, { "name": "cardBackgroundColor", "type": "text", "description": "card background color" }, { "name": "borderColor", "type": "text", "description": "border color" }, { "name": "arrowBtnColor", "type": "text", "description": "arrow btn color" }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "title1", "type": "text", "description": "title1" }, { "name": "content1", "type": "textarea", "description": "content1" }, { "name": "imageUrl1", "type": "image", "description": "imageUrl1" }, { "name": "title2", "type": "text", "description": "title2" }, { "name": "content2", "type": "textarea", "description": "content2" }, { "name": "imageUrl2", "type": "image", "description": "imageUrl2" } ], "values": { "backgroundColor": "", "collapsed": false, "cardBackgroundColor": "#ffffff", "borderColor": "#e6e8eb", "arrowBtnColor": "#6e6e73", "textColor": "#000000", "title1": "", "content1": "", "imageUrl1": "", "title2": "", "content2": "", "imageUrl2": "" }, "template": "

\">\n

\n <% if (title1 || content1 || imageUrl1) { %>\n

; border-color: <%= borderColor || '#e6e8eb' %>\">\n \n checked<% } %>>\n

\">\n <%= title1 %>\n \n \n

;color: <%= textColor || '#000000' %>\">\n <%= content1 %>\n <% if (imageUrl1) { %>\n \" alt=\"\" loading=\"lazy\">\n <% } %>\n

\n \n

\n <% } %>\n <% if (title2 || content2 || imageUrl2) { %>\n

; border-color: <%= borderColor || '#e6e8eb' %>\">\n \n checked<% } %>>\n

\">\n <%= title2 %>\n \n \n

; color: <%= textColor || '#000000' %>\">\n <%= content2 %>\n <% if (imageUrl2) { %>\n \" alt=\"\" loading=\"lazy\">\n <% } %>\n

\n \n

\n <% } %>\n

\n" }, "values": { "backgroundColor": "#F2F2F2", "collapsed": false, "cardBackgroundColor": "#ffffff", "borderColor": "#e6e8eb", "arrowBtnColor": "#6e6e73", "textColor": "#000000", "title1": "Bab 13. What's next?", "content1": "13-1. What's next?
\t", "imageUrl1": "", "title2": "", "content2": "", "imageUrl2": "" }, "uniqueId": "fc-block-12-2zod3sv5i", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-2-ougq4gl3d", "layout": { "id": "001", "description": "레이아웃 간격", "icon": "\n", "params": [ { "name": "spacing", "type": "number", "description": "spacing" }, { "name": "backgroundColor", "type": "text", "description": "background color" } ], "values": { "spacing": 10, "backgroundColor": "#ffffff" }, "template": "

rem;\n padding-bottom: <%= spacing/10/2 %>rem;\n background-color: <%= backgroundColor || '#ffffff' %>\">\n

\n" }, "values": { "spacing": "60", "backgroundColor": "#F2F2F2" }, "uniqueId": "fc-block-6-tbrqibmf6", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-1-izxzvnvf6", "layout": { "id": "215", "description": "캐러셀형 코스카드", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "숫자 입력" }, { "name": "paddingBottom", "type": "number", "description": "숫자 입력" }, { "name": "colorTheme", "type": "select", "description": "컬러 테마를 설정할 수 있습니다.
-라이트 모드 (default)
-다크 모드", "options": [ "theme--light", "theme--dark" ] }, { "name": "mobileColumnCount", "type": "select", "description": "모바일 카드 배열: 1단/2단", "options": [ 1, 2 ] }, { "name": "useNewTab", "type": "checkbox", "description": "use new tab" }, { "name": "title", "type": "text", "description": "레이아웃 제목" }, { "name": "reverseOrder", "type": "checkbox", "description": "체크하면 목록이 역순으로 나열됩니다.\n페이지 > 미리보기에서 확인해주세요" }, { "name": "courseList", "type": "list", "description": "이 레이아웃은 컴포저의 실시간 미리보기 지원이 불가합니다.\n페이지의 미리보기 기능을 활용해주세요.", "maxLength": 100, "params": [ { "name": "courseId", "type": "text", "description": "course id", "isRequired": true }, { "name": "imageBadge", "type": "text", "description": "공백 없이 최대 4글자까지 입력이 가능합니다.", "isRequired": true }, { "name": "imageBadgeBackgroundColor", "type": "text", "description": "기본 값은 #ff7450입니다.", "isRequired": true, "defaultValue": "#ff7450" }, { "name": "imageBadgeTextColor", "type": "text", "description": "기본 값은 #ffffff입니다.", "defaultValue": "#ffffff" } ] } ], "values": { "paddingTop": 40, "paddingBottom": 40, "colorTheme": "theme--light", "mobileColumnCount": 2, "useNewTab": false, "title": "", "reverseOrder": false, "courseList": [ { "courseId": "", "imageBadge": "", "imageBadgeBackgroundColor": "#ff7450", "imageBadgeTextColor": "#ffffff" } ] }, "template": "

\"\n data-color-theme=\"<%= colorTheme %>\"\n data-use-new-tab=\"<%= useNewTab %>\"\n data-mobile-column-count=\"<%= mobileColumnCount %>\"\n data-title=\"<%= title %>\"\n data-padding-top=\"<%= paddingTop %>\"\n data-padding-bottom=\"<%= paddingBottom %>\"\n data-reverse-order=\"<%= reverseOrder %>\"\n style=\"padding-top: <%= paddingTop / 10 %>rem; padding-bottom: <%= paddingBottom / 10 %>rem;\"\n>\n

\n <% if (title) { %>\n

<%= title %>

\n <% } %>\n

\">\n

\"\n data-course-id=\"<%= course.courseId %>\"\n data-image-badge=\"<%= course.imageBadge %>\"\n data-badge-background-color=\"<%= course.imageBadgeBackgroundColor || '#ff7450' %>\"\n data-badge-text-color=\"<%= course.imageBadgeTextColor || '#ffffff' %>\"\n data-id=\"<%= (course.id ) ? course.id : ( reverseOrder ? (course.id = course.length-idx) : (course.id = idx+1) ) %>\"\n >\n <% if (course.courseId) { %>\n \">\n <% if (course.imageBadge) { %>\n
; color: <%= course.imageBadgeTextColor || '#ffffff' %>\">\n
);\">\n <%= course.imageBadge %>\n
\n
\n <% } %>\n
\n
\n
\n
\n \n <% } %>\n

\n" }, "values": { "paddingTop": "60", "paddingBottom": "60", "colorTheme": "theme--light", "mobileColumnCount": 2, "useNewTab": false, "title": "Rekomendasi Kursus Lainnya", "reverseOrder": false, "courseList": [ { "courseId": "236719", "imageBadge": "Online", "imageBadgeBackgroundColor": "#ff7450", "imageBadgeTextColor": "#ffffff", "id": 1 }, { "courseId": "238279", "imageBadge": "Online", "imageBadgeBackgroundColor": "#ff7450", "imageBadgeTextColor": "#ffffff", "id": 2 }, { "courseId": "243023", "imageBadge": "Online", "imageBadgeBackgroundColor": "#ff7450", "imageBadgeTextColor": "#ffffff", "id": 3 }, { "courseId": "236743", "imageBadge": "Online", "imageBadgeBackgroundColor": "#ff7450", "imageBadgeTextColor": "#ffffff", "id": 4 } ] }, "uniqueId": "fc-block-1-444r4ge1z", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-1-l492n3qt9", "layout": { "id": "201", "description": "중앙정렬 고정 사이즈 이미지", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useImageLeft", "type": "checkbox", "description": "use image center" }, { "name": "imageUrl", "type": "image", "description": "image url" }, { "name": "mobileImageUrl", "type": "image", "description": "mobile image url" }, { "name": "imageWidth", "type": "number", "description": "image width" }, { "name": "alt", "type": "text", "description": "이미지를 설명(대체)하는 대표 문구" }, { "name": "useNewTab", "type": "checkbox", "description": "" }, { "name": "link", "type": "text", "description": "link" } ], "values": { "backgroundColor": "#ffffff", "useImageLeft": false, "imageUrl": "", "mobileImageUrl": "", "imageWidth": 980, "alt": "", "useNewTab": true, "link": "" }, "template": "

\">\n

\n" }, "values": { "backgroundColor": "#1B52B7", "useImageLeft": false, "imageUrl": "https://cdn.day1company.io/prod/uploads/202410/165558-1395/웹---상세페이지-배너.webp", "mobileImageUrl": "https://cdn.day1company.io/prod/uploads/202410/165615-1395/모바일---상세페이지-배너.webp", "imageWidth": 980, "alt": "", "useNewTab": true, "link": "https://forms.gle/c5rroDMAPEujmH9f8" }, "uniqueId": "fc-block-1-7dvsr8mpi", "isChecked": false, "hasSyntaxErrorTags": false, "hidden": true }, { "id": "fc-block-2-7cyv2mf11", "layout": { "id": "101", "description": "1단 자유 텍스트", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "padding top" }, { "name": "paddingBottom", "type": "number", "description": "padding bottom" }, { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useTextCenter", "type": "checkbox", "description": "use text center" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h1-text", "fc-h2-text", "fc-h3-text", "fc-h4-text", "fc-h5-text", "fc-h6-text", "fc-content-text" ] }, { "name": "textColor", "type": "text", "description": "text color" }, { "name": "text", "type": "textarea", "description": "text" } ], "values": { "paddingTop": 10, "paddingBottom": 10, "backgroundColor": "", "useTextCenter": false, "textSize": "fc-h1-text", "textColor": "#000000", "text": "" }, "template": "

background: <%= backgroundColor %>;<% } %> padding-top: <%= paddingTop/10 %>rem; padding-bottom: <%= paddingBottom/10 %>rem\">\n

fc-text-align-center<% } %>\">\n

\" style=\"<% if(textColor) { %>color: <%= textColor %><% } %>\">\n <%= text %>\n

\n" }, "values": { "paddingTop": "60", "paddingBottom": "30", "backgroundColor": "#000000", "useTextCenter": false, "textSize": "fc-h4-text", "textColor": "#ffffff", "text": "\nKursus tingkat kepuasan \n\n\n *dari 10\n
\nIni adalah ulasan asli dari para peserta kursus.\n" }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-1-wg8w1c8d9", "isChecked": false }, { "id": "fc-block-3-ztfkecpf3", "layout": { "id": "212", "description": "자동재생 캐러셀 (인피니티루프, 셔플)", "icon": "\n", "params": [ { "name": "paddingTop", "type": "number", "description": "숫자 입력" }, { "name": "paddingBottom", "type": "number", "description": "숫자 입력" }, { "name": "columnCount", "type": "select", "description": "default - 3columns", "options": [ "3", "2" ] }, { "name": "autoPlay", "type": "checkbox", "description": "default - on", "options": [ "3", "2" ] }, { "name": "shuffleOption", "type": "checkbox", "description": "컨텐츠의 순서를 셔플해서 보여주는 기능입니다.", "options": [ "3", "2" ] }, { "name": "autoPlayDelay", "type": "number", "description": "숫자를 입력하여 자동 재생되는 타이밍을 조절할 수 있습니다.
단위는 ms(밀리세컨드)로 조절됩니다.
1초 = 1000ms" }, { "name": "backgroundColor", "type": "text", "description": "배경 색상" }, { "name": "colorTheme", "type": "select", "description": "네가지 테마중 하나를 선택할 수 있습니다.
light theme_red - 밝은 배경에 사용합니다 (버튼포인트)
dark theme_red - 어두운 배경에 사용합니다 (버튼포인트)
light theme_mono - 밝은 배경에 사용합니다
dark theme_mono - 어두운 배경에 사용합니다", "options": [ "theme-light-red", "theme-dark-red", "theme-light-mono", "theme-dark-mono" ] }, { "name": "text1Size", "type": "select", "description": "h5(20px), h6(16px) content1(14px)", "options": [ "text--h5", "text--h6", "text--content1" ] }, { "name": "text2Size", "type": "select", "description": "h5(20px), h6(16px) content1(14px)", "options": [ "text--h5", "text--h6", "text--content1" ] }, { "name": "cards", "type": "list", "description": "카드는 반드시 규칙을 맞춰서 작성해주세요.
- 2단 설정 : 3개 이상 작성할 것
- 3단 설정 : 4개 이상 작성할 것", "maxLength": 20, "params": [ { "name": "link", "type": "text", "description": "클릭시 열릴 페이지의 URL을 입력하세요." }, { "name": "imageUrl", "type": "image", "description": "파일 업로드" }, { "name": "text1", "type": "text", "description": "자유 입력" }, { "name": "text2", "type": "text", "description": "자유 입력" } ] } ], "values": { "paddingTop": 40, "paddingBottom": 40, "columnCount": "3", "autoPlay": true, "shuffleOption": false, "autoPlayDelay": 2500, "backgroundColor": "#ffffff", "colorTheme": "theme-light-red", "text1Size": "text--h5", "text2Size": "text--h6", "cards": [ { "imageUrl": "", "text1": "", "text2": "", "link": "" }, { "imageUrl": "", "text1": "", "text2": "", "link": "" }, { "imageUrl": "", "text1": "", "text2": "", "link": "" } ] }, "template": "rem;\n padding-bottom: <%= paddingBottom/10 %>rem;\n background-color: <%= backgroundColor || '#ffffff' %>;\n \"\n>\n

\">\n

\n \"\n data-column-count=\"<%= columnCount %>\"\n data-shuffle=\"<%= shuffleOption %>\"\n data-autoplay=\"<%= autoPlay %>\"\n data-delay=\"<%= autoPlayDelay %>\"\n >\n <% cards.forEach(({ imageUrl, text1, text2, link }) => { %>\n

\n <% if (link) { %> \"> <% } %> \n

\">\n <% if (imageUrl) { %>\n

\" alt=\"\" loading=\"lazy\" />\n <% } %>\n

\n <% if (text1) { %>\n

\"><%= text1 %>

\n <% } %> <% if (text2) { %>\n

\"><%= text2 %>

\n <% } %>\n <% if (link) { %> <% } %> \n

\n <% }); %>\n \n

\n\n" }, "values": { "paddingTop": "0", "paddingBottom": "100", "columnCount": "2", "autoPlay": true, "shuffleOption": false, "autoPlayDelay": "2000", "backgroundColor": "#000000", "colorTheme": "theme-light-mono", "text1Size": "text--h5", "text2Size": "text--h6", "cards": [ { "imageUrl": "https://cdn.day1company.io/prod/uploads/202412/153024-199/review-1.webp", "text1": "", "text2": "", "link": "" }, { "imageUrl": "https://cdn.day1company.io/prod/uploads/202412/153028-199/review-2.webp", "text1": "", "text2": "", "link": "" }, { "imageUrl": "https://cdn.day1company.io/prod/uploads/202412/153031-199/review-3.webp", "text1": "", "text2": "", "link": "" }, { "link": "", "imageUrl": "https://cdn.day1company.io/prod/uploads/202412/153036-199/review-4.webp", "text1": "", "text2": "" }, { "link": "", "imageUrl": "https://cdn.day1company.io/prod/uploads/202412/153047-199/review-5.webp", "text1": "", "text2": "" }, { "link": "", "imageUrl": "https://cdn.day1company.io/prod/uploads/202412/153052-199/review-6.webp", "text1": "", "text2": "" }, { "link": "", "imageUrl": "https://cdn.day1company.io/prod/uploads/202412/153057-199/review-7.webp", "text1": "", "text2": "" }, { "link": "", "imageUrl": "https://cdn.day1company.io/prod/uploads/202412/153102-199/review-8.webp", "text1": "", "text2": "" }, { "link": "", "imageUrl": "https://cdn.day1company.io/prod/uploads/202412/153107-199/review-9.webp", "text1": "", "text2": "" } ] }, "hasSyntaxErrorTags": false, "uniqueId": "fc-block-2-ndfru5ffo", "isChecked": false }, { "id": "fc-block-1-qzm0iisjh", "layout": { "id": "201", "description": "중앙정렬 고정 사이즈 이미지", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "useImageLeft", "type": "checkbox", "description": "use image center" }, { "name": "imageUrl", "type": "image", "description": "image url" }, { "name": "mobileImageUrl", "type": "image", "description": "mobile image url" }, { "name": "imageWidth", "type": "number", "description": "image width" }, { "name": "alt", "type": "text", "description": "이미지를 설명(대체)하는 대표 문구" }, { "name": "useNewTab", "type": "checkbox", "description": "" }, { "name": "link", "type": "text", "description": "link" } ], "values": { "backgroundColor": "#ffffff", "useImageLeft": false, "imageUrl": "", "mobileImageUrl": "", "imageWidth": 980, "alt": "", "useNewTab": true, "link": "" }, "template": "

\">\n

\n" }, "values": { "backgroundColor": "#191919", "useImageLeft": false, "imageUrl": "https://cdn.day1company.io/prod/uploads/202403/125606-472/introduction---trust.webp", "mobileImageUrl": "https://cdn.day1company.io/prod/uploads/202403/131455-472/introduction---trust-mob-1.webp", "imageWidth": 980, "alt": "", "useNewTab": true, "link": "" }, "uniqueId": "fc-block-1-5drnvtrkl", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-35-3szxympov", "layout": { "id": "001", "description": "레이아웃 간격", "icon": "\n", "params": [ { "name": "spacing", "type": "number", "description": "spacing" }, { "name": "backgroundColor", "type": "text", "description": "background color" } ], "values": { "spacing": 10, "backgroundColor": "#ffffff" }, "template": "

rem;\n padding-bottom: <%= spacing/10/2 %>rem;\n background-color: <%= backgroundColor || '#ffffff' %>\">\n

\n" }, "values": { "spacing": "60", "backgroundColor": "#000000" }, "uniqueId": "fc-block-62-tf4u346pk", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-67-96yht6zsz", "layout": { "id": "502", "description": "1단 아코디언 리스트 (FAQ 전용)", "icon": "\n", "params": [ { "name": "backgroundColor", "type": "text", "description": "background color" }, { "name": "collapseAll", "type": "checkbox", "description": "" }, { "name": "textSize", "type": "select", "description": "text size", "options": [ "fc-h6-text", "fc-content-text" ] }, { "name": "title1", "type": "text", "description": "title1 text" }, { "name": "content1", "type": "textarea", "description": "content1 text" }, { "name": "title2", "type": "text", "description": "title2 text" }, { "name": "content2", "type": "textarea", "description": "content2 text" }, { "name": "title3", "type": "text", "description": "title3 text" }, { "name": "content3", "type": "textarea", "description": "content3 text" }, { "name": "title4", "type": "text", "description": "title4 text" }, { "name": "content4", "type": "textarea", "description": "content4 text" }, { "name": "title5", "type": "text", "description": "title5 text" }, { "name": "content5", "type": "textarea", "description": "content5 text" }, { "name": "title6", "type": "text", "description": "title6 text" }, { "name": "content6", "type": "textarea", "description": "content6 text" }, { "name": "title7", "type": "text", "description": "title7 text" }, { "name": "content7", "type": "textarea", "description": "content7 text" }, { "name": "title8", "type": "text", "description": "title8 text" }, { "name": "content8", "type": "textarea", "description": "content8 text" }, { "name": "title9", "type": "text", "description": "title9 text" }, { "name": "content9", "type": "textarea", "description": "content9 text" }, { "name": "title10", "type": "text", "description": "title10 text" }, { "name": "content10", "type": "textarea", "description": "content10 text" }, { "name": "title11", "type": "text", "description": "title11 text" }, { "name": "content11", "type": "textarea", "description": "content11 text" }, { "name": "title12", "type": "text", "description": "title12 text" }, { "name": "content12", "type": "textarea", "description": "content12 text" }, { "name": "title13", "type": "text", "description": "title13 text" }, { "name": "content13", "type": "textarea", "description": "content13 text" }, { "name": "title14", "type": "text", "description": "title14 text" }, { "name": "content14", "type": "textarea", "description": "content14 text" }, { "name": "title15", "type": "text", "description": "title15 text" }, { "name": "content15", "type": "textarea", "description": "content15 text" }, { "name": "title16", "type": "text", "description": "title16 text" }, { "name": "content16", "type": "textarea", "description": "content16 text" }, { "name": "title17", "type": "text", "description": "title17 text" }, { "name": "content17", "type": "textarea", "description": "content17 text" }, { "name": "title18", "type": "text", "description": "title18 text" }, { "name": "content18", "type": "textarea", "description": "content18 text" }, { "name": "contentLinkTitle", "type": "text", "description": "content link title" }, { "name": "contentLink", "type": "url", "description": "content link" }, { "name": "useNewTab", "type": "checkbox", "description": "" }, { "name": "contentLinkDescription", "type": "text", "description": "content link description" } ], "values": { "backgroundColor": "", "collapseAll": false, "textSize": "fc-h6-text", "title1": "", "content1": "", "title2": "", "content2": "", "title3": "", "content3": "", "title4": "", "content4": "", "title5": "", "content5": "", "title6": "", "content6": "", "title7": "", "content7": "", "title8": "", "content8": "", "title9": "", "content9": "", "title10": "", "content10": "", "title11": "", "content11": "", "title12": "", "content12": "", "title13": "", "content13": "", "title14": "", "content14": "", "title15": "", "content15": "", "title16": "", "content16": "", "title17": "", "content17": "", "title18": "", "content18": "", "contentLinkTitle": "1:1 문의하기", "contentLinkDescription": "해당 사항이 없다면 1:1 문의 게시판을 이용해주세요", "useNewTab": true, "contentLink": "https://fastcampus.co.kr" }, "template": "

background-color: <%= backgroundColor %><% } %>\">\n

\n <% if (title1 || content1) { %>\n

\n \">\n >\n \n <%= title1 %>\n \n \"><%= content1 %>\n \n

\n <% } %>\n <% if (title2 || content2) { %>\n

\n \">\n >\n \n <%= title2 %>\n \n \"><%= content2 %>\n \n

\n <% } %>\n <% if (title3 || content3) { %>\n

\n \">\n >\n \n <%= title3 %>\n \n \"><%= content3 %>\n \n

\n <% } %>\n <% if (title4 || content4) { %>\n

\n \">\n >\n \n <%= title4 %>\n \n \"><%= content4 %>\n \n

\n <% } %>\n <% if (title5 || content5) { %>\n

\n \">\n >\n \n <%= title5 %>\n \n \"><%= content5 %>\n \n

\n <% } %>\n <% if (title6 || content6) { %>\n

\n \">\n >\n \n <%= title6 %>\n \n \"><%= content6 %>\n \n

\n <% } %>\n <% if (title7 || content7) { %>\n

\n \">\n >\n \n <%= title7 %>\n \n \"><%= content7 %>\n \n

\n <% } %>\n <% if (title8 || content8) { %>\n

\n \">\n >\n \n <%= title8 %>\n \n \"><%= content8 %>\n \n

\n <% } %>\n <% if (title9 || content9) { %>\n

\n \">\n >\n \n <%= title9 %>\n \n \"><%= content9 %>\n \n

\n <% } %>\n <% if (title10 || content10) { %>\n

\n \">\n >\n \n <%= title10 %>\n \n \"><%= content10 %>\n \n

\n <% } %>\n <% if (title11 || content11) { %>\n

\n \">\n >\n \n <%= title11 %>\n \n \"><%= content11 %>\n \n

\n <% } %>\n <% if (title12 || content12) { %>\n

\n \">\n >\n \n <%= title12 %>\n \n \"><%= content12 %>\n \n

\n <% } %>\n <% if (title13 || content13) { %>\n

\n \">\n >\n \n <%= title13 %>\n \n \"><%= content13 %>\n \n

\n <% } %>\n <% if (title14 || content14) { %>\n

\n \">\n >\n \n <%= title14 %>\n \n \"><%= content14 %>\n \n

\n <% } %>\n <% if (title15 || content15) { %>\n

\n \">\n >\n \n <%= title15 %>\n \n \"><%= content15 %>\n \n

\n <% } %>\n <% if (title16 || content16) { %>\n

\n \">\n >\n \n <%= title16 %>\n \n \"><%= content16 %>\n \n

\n <% } %>\n <% if (title17 || content17) { %>\n

\n \">\n >\n \n <%= title17 %>\n \n \"><%= content17 %>\n \n

\n <% } %>\n <% if (title18 || content18) { %>\n

\n \">\n >\n \n <%= title18 %>\n \n \"><%= content18 %>\n \n

\n <% } %>\n

\n <% if (contentLinkTitle || contentLinkDescription) { %>\n \n <% } %>\n

\n" }, "values": { "backgroundColor": "#000000", "collapseAll": true, "textSize": "fc-content-text", "title1": " Penting untuk Diketahui", "content1": "\n\n- Informasi di halaman ini dapat berubah sewaktu-waktu tanpa pemberitahuan sebelumnya.
\n- Kurikulum dapat ditambah, dikurangi, atau dimodifikasi selama proses pengembangan.
\n- Promosi diskon dapat berakhir lebih awal atau diperpanjang tanpa pemberitahuan sebelumnya, tergantung pada situasinya.
\n- Kursus ini menggunakan Mac sebagai platform utama, namun tetap dapat diakses oleh pengguna Windows.
\n- Dalam keadaan force majeure, seperti bencana alam atau penutupan usaha, layanan kami mungkin terpaksa dihentikan.
\n- Kami akan menyediakan spesifikasi perangkat keras dari pengajar dan rekomendasi spesifikasi sebagai referensi dalam mengikuti kursus.
\n", "title2": "", "content2": "", "title3": "", "content3": "", "title4": "Kebijakan Pengembalian Dana", "content4": "\n- Ingin tahu lebih lanjut tentang kebijakan pengembalian dana kami? Pelajari di link berikut ►\n", "title5": "Hak Cipta", "content5": "\n- Fast Campus melarang keras semua tindakan pelanggaran hak cipta, termasuk distribusi dan pengolahan yang tidak sah, berbagi melalui tangkapan layar atau perekaman, dan penjualan materi kursus yang tidak sah. Jika penggunaan yang tidak sah terdeteksi, Anda dapat dikenakan sanksi hukum berdasarkan undang-undang hak cipta.\n", "title6": "", "content6": "", "title7": "", "content7": "", "title8": "", "content8": "", "title9": "", "content9": "", "title10": "", "content10": "", "title11": "", "content11": "", "title12": "", "content12": "", "title13": "", "content13": "", "title14": "", "content14": "", "title15": "", "content15": "", "title16": "", "content16": "", "title17": "", "content17": "", "title18": "", "content18": "", "contentLinkTitle": "", "contentLinkDescription": "", "useNewTab": false, "contentLink": "" }, "uniqueId": "fc-block-63-jlrk893fx", "isChecked": false, "hasSyntaxErrorTags": false }, { "id": "fc-block-4-s6l3w5x2x", "layout": { "id": "001", "description": "레이아웃 간격", "icon": "\n", "params": [ { "name": "spacing", "type": "number", "description": "spacing" }, { "name": "backgroundColor", "type": "text", "description": "background color" } ], "values": { "spacing": 10, "backgroundColor": "#ffffff" }, "template": "

rem;\n padding-bottom: <%= spacing/10/2 %>rem;\n background-color: <%= backgroundColor || '#ffffff' %>\">\n

\n" }, "values": { "spacing": "80", "backgroundColor": "#000000" }, "uniqueId": "fc-block-1-9qctu43ww", "isChecked": false, "hasSyntaxErrorTags": false } ]

<%= title || '제목을 입력해주세요.' %>

COUPON

\"><%= title1 %>

\"><%= title2 %>

\"><%= title3 %>

\"><%= title1 %>

\"><%= title2 %>

\"><%= title3 %>

\" style=\"border: 2px solid <%= labelColor || '#000000' %>; color: <%= labelColor || '#000000' %>\">\n <%= labelText %>\n

\">\n <%= title1 %>\n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\" transform=\"rotate(-180 16 16)\"/>\n \n \n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\"/>\n \n \n

\">\n <%= title2 %>\n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\" transform=\"rotate(-180 16 16)\"/>\n \n \n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\"/>\n \n \n

\">\n <%= title1 %>\n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\" transform=\"rotate(-180 16 16)\"/>\n \n \n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\"/>\n \n \n

\">\n <%= title2 %>\n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\" transform=\"rotate(-180 16 16)\"/>\n \n \n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\"/>\n \n \n

\" style=\"border: 2px solid <%= labelColor || '#000000' %>; color: <%= labelColor || '#000000' %>\">\n <%= labelText %>\n

\">\n <%= title1 %>\n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\" transform=\"rotate(-180 16 16)\"/>\n \n \n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\"/>\n \n \n

\">\n <%= title2 %>\n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\" transform=\"rotate(-180 16 16)\"/>\n \n \n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\"/>\n \n \n

\" style=\"border: 2px solid <%= labelColor || '#000000' %>; color: <%= labelColor || '#000000' %>\">\n <%= labelText %>\n

\">\n <%= title1 %>\n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\" transform=\"rotate(-180 16 16)\"/>\n \n \n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\"/>\n \n \n

\">\n <%= title2 %>\n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\" transform=\"rotate(-180 16 16)\"/>\n \n \n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\"/>\n \n \n

\">\n <%= title1 %>\n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\" transform=\"rotate(-180 16 16)\"/>\n \n \n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\"/>\n \n \n

\">\n <%= title2 %>\n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\" transform=\"rotate(-180 16 16)\"/>\n \n \n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\"/>\n \n \n

\" style=\"border: 2px solid <%= labelColor || '#000000' %>; color: <%= labelColor || '#000000' %>\">\n <%= labelText %>\n

\">\n <%= title1 %>\n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\" transform=\"rotate(-180 16 16)\"/>\n \n \n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\"/>\n \n \n

\">\n <%= title2 %>\n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\" transform=\"rotate(-180 16 16)\"/>\n \n \n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\"/>\n \n \n

\" style=\"border: 2px solid <%= labelColor || '#000000' %>; color: <%= labelColor || '#000000' %>\">\n <%= labelText %>\n

\">\n <%= title1 %>\n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\" transform=\"rotate(-180 16 16)\"/>\n \n \n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\"/>\n \n \n

\">\n <%= title2 %>\n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\" transform=\"rotate(-180 16 16)\"/>\n \n \n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\"/>\n \n \n

\" style=\"border: 2px solid <%= labelColor || '#000000' %>; color: <%= labelColor || '#000000' %>\">\n <%= labelText %>\n

\">\n <%= title1 %>\n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\" transform=\"rotate(-180 16 16)\"/>\n \n \n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\"/>\n \n \n

\">\n <%= title2 %>\n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\" transform=\"rotate(-180 16 16)\"/>\n \n \n \n \n \n \" stroke-width=\"2\" d=\"M10 13L15.951 19 22 13\"/>\n \n \n

<%= title %>

\">\n <%= title1 %>\n \n \n

\">\n <%= title2 %>\n \n \n

\">\n <%= title1 %>\n \n \n

\">\n <%= title2 %>\n \n \n

\">\n <%= title1 %>\n \n \n

\">\n <%= title2 %>\n \n \n

\">\n <%= title1 %>\n \n \n

\">\n <%= title2 %>\n \n \n

\">\n <%= title1 %>\n \n \n

\">\n <%= title2 %>\n \n \n

\">\n <%= title1 %>\n \n \n

\">\n <%= title2 %>\n \n \n

\">\n <%= title1 %>\n \n \n

\">\n <%= title2 %>\n \n \n

\">\n <%= title1 %>\n \n \n

\">\n <%= title2 %>\n \n \n

Theo’s Frontend Academy Build my online mall with React & Redux

Informasi detail kelas

(IDN) [Influencer] Theo’s Frontend Academy Build my online mall with React & Redux ( 11/25~ ) Details