본문 바로가기

분류 전체보기138

section 태그가 추가된 이유 기존에도 header, main, footer, aside 가 있었는데, 굳이 왜 section 이라는 태그를 더 추가한 것인가? chatGTP 기존에도 ` 단독으로 사용된 section 태그 이것은 단독으로 사용된 section 태그입니다. 위 코드에서 `` 태그는 하나의 구획을 나타내지만, 의미적인 관점에서 다른 시맨틱 태그와 함께 사용하는 것이 더욱 적절하고 의미론적으로 풍부한 HTML 구조를 형성하는 데에 도움이 됩니다. 따라서 `` 태그를 사용할 때는 문서 구조를 명확히 이해하고, 다른 의미론적 태그와 함께 조합하여 사용하는 것이 권장됩니다. section 태그와 함께 header, main, article, footer, aside 태그로 구획을 나누는 코드를 작성해 봐. 아래 코드는 `` 태.. 2023. 7. 21.
html, img, 절대경로/상대경로 출처 : 실전코딩 짐코딩 클럽 2023. 7. 21.
inline or block HTML의 모든 요소는 해당 요소가 웹 브라우저에 어떻게 보이는가를 결정짓는 display 속성을 가집니다. 대부분의 HTML 요소는 이러한 display 속성값으로 inline 타입 도는 block 타입 - 이 두 가지 값 중 하나를 가지게 됩니다. , , , , , 요소는 display 속성값이 블록(block)인 대표적인 요소입니다. , , 요소는 display 속성값이 인라인(inline)인 대표적인 요소입니다. 출처 TCPschool.com inline 요소: 컨텐츠가 수평으로 이어지는 것을 의미합니다. 즉, 요소들이 한 줄에 나란히 배치되며, 가로 방향으로 흐릅니다. block 요소: 컨텐츠가 수직으로 쌓이는 것을 의미합니다. 즉, 요소들이 새로운 줄에서 시작되며, 세로 방향으로 쌓입니다. 출.. 2023. 7. 21.
<div class=>`와 `<div id=>`의 차이 chatGTP ``와 ``의 차이를 쉽게 설명해 드릴게요! 우선, ``는 웹페이지에서 여러 내용들을 묶어주는 역할을 해요. 예를 들면, 책에서 챕터들을 구분하기 위해 목차에 번호를 매기듯이, 웹페이지에서도 ``는 다른 내용들을 그룹으로 묶어줍니다. 1. ``: ``는 여러 개의 HTML 요소들을 묶을 때 사용합니다. 특정한 이름(class 이름)을 붙여서 여러 곳에서 같은 스타일이나 동작을 적용할 수 있어요. 클래스 이름은 여러 요소들이 함께 묶여 있는 그룹을 표시하는 데 사용됩니다. 하나의 요소가 여러 클래스를 가질 수도 있어요. ```html 제목 내용 내용 내용 ``` 2. ``: ``는 특정한 HTML 요소를 식별할 때 사용해요. 클래스와는 달리, 아이디(id)는 페이지 내에서 오직 하나의 요소에.. 2023. 7. 21.
크로스플랫폼과 html 크로스플랫폼을 지향한다는 전제에서 html 작성에 유의할 점이 있나? Bard 네, 크로스플랫폼을 지향한다는 전제에서 HTML 작성에 유의해야 할 점은 다음과 같습니다. 브라우저에 따라 지원되지 않는 태그나 속성을 사용하지 마세요. 예를 들어, `` 태그는 Internet Explorer에서 지원되지 않습니다. 브라우저에 따라 표시되는 방식이 다른 태그나 속성을 사용하지 마세요. 예를 들어, `` 태그는 Internet Explorer와 Firefox에서 표시되는 방식이 다릅니다. CSS를 사용하여 HTML을 스타일링하세요. CSS는 브라우저에 따라 동일하게 표시되므로, HTML을 스타일링할 때는 CSS를 사용하세요. 웹 표준을 준수하세요. 웹 표준을 준수하면, 모든 브라우저에서 동일하게 웹 페이지를 표.. 2023. 7. 21.
영어의 힘 식별자(이름)을 꼭 영어로 써야 하나? Bard 식별자는 꼭 영어로 써야 할 필요는 없습니다. 다른 나라의 언어로 써도 됩니다. 하지만, 식별자는 웹 브라우저에서 이해할 수 있어야 합니다. 따라서, 식별자는 영어로 쓰는 것이 좋습니다. 식별자를 다른 나라의 언어로 쓸 경우, 웹 브라우저에서 이해하지 못할 수 있습니다. 그 결과, 웹 페이지가 제대로 표시되지 않을 수 있습니다. 또한, 식별자를 다른 나라의 언어로 쓸 경우, 다른 나라의 사용자들이 이해하지 못할 수 있습니다. 그 결과, 웹 페이지의 접근성이 떨어질 수 있습니다. 따라서, 식별자는 영어로 쓰는 것이 좋습니다. 2023. 7. 21.
문서 구조화하기 섹션 태그에 대해 설명해. Bard HTML의 태그는 웹 페이지의 구조를 나타내는 데 사용되는 태그입니다. 태그는 웹 페이지의 섹션을 그룹화하고, 섹션의 콘텐츠를 스타일링하는 데 사용됩니다. 태그는 HTML5에서 도입된 태그로, HTML4에서는 태그를 사용하여 섹션을 그룹화했습니다. 태그는 태그와 동일한 기능을 수행하지만, 태그는 웹 페이지의 구조를 나타내는 데 더 적합합니다. 태그의 사용법은 다음과 같습니다. 섹션 태그로 페이지 상단을 생성할 수 있나? Bard 네, 섹션 태그로 페이지 상단을 생성할 수 있습니다. 섹션 태그는 웹 페이지의 섹션을 그룹화하고, 섹션의 콘텐츠를 스타일링하는 데 사용되는 태그입니다. 따라서 섹션 태그를 사용하여 페이지 상단에 대한 섹션을 정의하고, 해당 섹션에 대한 콘텐츠를.. 2023. 7. 21.
HTML5 144개의 태그 중 가장 많이 쓰이는 것 HTML5의 종류 (by Bard) HTML5는 100개 이상의 태그를 제공합니다. HTML5의 태그는 크게 6가지로 분류됩니다. 컨텐츠 태그: 텍스트, 이미지, 링크 등을 표시하는 태그입니다. 컨테이너 태그: 다른 태그를 포함하는 태그입니다. 폼 태그: 사용자 입력을 수집하는 태그입니다. 헤드 태그: HTML 문서의 메타 데이터를 포함하는 태그입니다. 섹션 태그: HTML 문서를 구조화하는 태그입니다. 스크립트 태그: JavaScript 코드를 포함하는 태그입니다. HTML5의 태그는 HTML5 표준에서 정의되어 있습니다. HTML5 표준은 W3C에서 정의하고 있습니다. 시멘틱 의미를 가지는 HTML 태그 (by chatGTP) 시멘틱 의미를 가지는 HTML 태그들은 웹 페이지의 구조와 의미를 더 명확.. 2023. 7. 21.
flexbox 태그 `flexbox`는 CSS3에서 도입된 레이아웃 모델로, 웹 페이지의 요소를 유연하게 배치하기 위해 사용되는 CSS 속성들의 집합입니다. `flexbox`를 이용하면 컨테이너와 그 안의 요소들을 가로 또는 세로 방향으로 정렬하고 배치할 수 있습니다. `flexbox`는 주로 부모 요소인 컨테이너와 그 자식 요소인 아이템들을 다루는데 사용됩니다. 컨테이너에 `display: flex;`를 설정하면 해당 요소는 `flexbox` 레이아웃 모드로 전환됩니다. `flexbox`를 사용할 때 자주 쓰이는 속성들은 다음과 같습니다: 1. `display: flex;`: 컨테이너를 `flexbox` 레이아웃 모드로 전환합니다. 2. `flex-direction`: 컨테이너 안의 아이템들의 배치 방향을 지정합니다. (.. 2023. 7. 21.
코드 접기 비주얼 스튜디오 코드(VSC)에서 코딩 작업을 편리하기 위해 코드 접기 기능을 쓰려면? Bard Visual Studio Code에서 코드를 접는 방법은 다음과 같습니다. `Ctrl`+`Shift`+`[` : 커서가 있는 줄을 접습니다. `Ctrl`+`Shift`+`]` : 커서가 있는 줄을 펼칩니다. `Alt`+`Shift`+`Z` : 현재 파일의 모든 줄을 접습니다. `Alt`+`Shift`+`Y` : 현재 파일의 모든 줄을 펼칩니다. `Ctrl`+`K`+`C` : 선택한 줄을 접습니다. `Ctrl`+`K`+`U` : 선택한 줄을 펼칩니다. Ctrl`+`K`+`C`의 단축키의 C는 Collapse의 약자입니다. Ctrl+K+U를 누르면 코드의 선택한 줄을 펼칩니다. 이 단축키의 U는 Unfold의 약.. 2023. 7. 21.
npm 방식과 다운로드/설치 방식 장단점 선호하는 방식은 개발자들에 따라 다를 수 있으며, 상황에 따라 적절한 방식을 선택하는 것이 중요합니다. 각 방식의 장단점을 살펴보면 다음과 같습니다: 1. npm 방식: - 장점: - npm은 Node.js의 패키지 매니저로 매우 널리 사용되고, 다양한 라이브러리와 모듈들이 npm을 통해 제공되고 있습니다. - 의존성 관리가 용이하여 필요한 라이브러리를 쉽게 설치하고 관리할 수 있습니다. - 프로젝트의 빌드 시스템에 통합하여 사용할 수 있으며, 자동으로 최신 버전을 유지하거나 업데이트할 수 있습니다. - 단점: - npm을 사용하려면 Node.js를 먼저 설치해야 하며, 이는 추가적인 설치 과정이 필요할 수 있습니다. - 라이브러리를 설치하고 관리하는 과정이 조금 복잡할 수 있습니다. 2. 다운로드 방식.. 2023. 7. 20.
오픈소스 개발자들은 어떤 방식으로 이윤을 얻지? 오픈소스 개발자들은 어떤 방식으로 이윤을 얻지? chatGTP 무료 프레임워크를 개발한 개발자나 회사는 주로 다음과 같은 방식으로 이윤을 얻을 수 있습니다: 1. **기부나 후원**: 일부 오픈 소스 프로젝트는 개발자들이 무료로 제공하지만, 사용자들로부터 기부나 후원을 받아 프로젝트의 유지보수 및 개선을 지원할 수 있습니다. 개발자들은 자발적으로 개발한 프로젝트에 대해 기부를 받아 지속적으로 업데이트와 버그 픽스, 지원을 제공할 수 있습니다. 2. **유료 지원 및 컨설팅**: 오픈 소스 프로젝트를 사용하는 기업이나 개인이 프로젝트의 추가적인 지원이나 컨설팅 서비스를 필요로 할 때, 개발자나 회사는 유료로 지원 서비스를 제공할 수 있습니다. 이를 통해 사용자들은 더 전문적인 지원과 개인화된 컨설팅을 받을.. 2023. 7. 20.
이미지 삽입/편집 관련 JS 프레임워크? 이미지 삽입/편집과 관련한 JavaScript 프레임워크 중에 추천할 만한 건? chatGTP 이미지 삽입/편집과 관련하여 추천할 만한 JavaScript 프레임워크 중에는 다음과 같은 라이브러리들이 있습니다: 1. Dropzone.js: Dropzone.js는 이미지와 파일 업로드를 간편하게 처리할 수 있는 라이브러리입니다. 드래그 앤 드롭을 지원하며, 이미지 미리보기 기능과 파일 업로드 관련 이벤트를 쉽게 처리할 수 있습니다. 2. Cropper.js: Cropper.js는 이미지를 자르고 편집하는 기능을 제공하는 라이브러리입니다. 사용자가 원하는 영역으로 이미지를 자를 수 있도록 도와주며, 회전, 확대/축소 등 다양한 편집 기능을 제공합니다. 3. Fabric.js: Fabric.js는 캔버스 기반.. 2023. 7. 20.
이미지(로고) 삽입 사용자가 이미지를 삽입할 수 있는 작은 박스를 작성해봐. 사용자가 이미지를 삽입할 수 있는 작은 박스를 작성해봐. 1. 박스 크기는 가로 200px 세로 200px이며 테두리는 옅은 회색이고 내부 바탕색은 흰색이야. 2. 박스에 커서가 다가가면 '새로운 로고 등록하기'라는 글자 나타나는데 글자가 나타난 이후 박스 안쪽을 클릭하면 사용자의 PC 탐색 창이 나타나서 이미지 찾기 및 업로드가 가능하다. 가로 세로 300 px 이하 사이즈만 업로드 가능하도록 만든다. 3. 이미지(=로고)가 업로드되면 박스의 회색 테두리는 투명으로 바뀐다. 4. 이미지(=로고)이 이미 업로드된 상태에서는, 사용자가 이미지를 3초 이상 롱클릭하면 팝업 창이 나타나면서 [새 로고로 교체] 버튼과 [이 로고 삭제] 버튼 중에 어느 하.. 2023. 7. 20.
주석 처리 (HTML, JavaScript, CSS) 물론, 각 언어별 주석 처리 방법을 간단하고 이해하기 쉽게 설명하겠습니다. 1. HTML 주석 처리: - HTML에서 주석 처리는 ``로 끝나는 부분을 사용합니다. - HTML 주석은 브라우저에는 표시되지 않으며, 코드 설명이나 임시로 코드를 비활성화하는 데 사용됩니다. 2. JavaScript 주석 처리: - JavaScript에서 주석 처리는 `//`를 사용하여 한 줄 주석을 처리하거나, `/*`로 시작하여 `*/`로 끝나는 부분을 사용하여 여러 줄 주석을 처리합니다. - 주석은 JavaScript 코드를 실행할 때 무시되며, 코드에 대한 설명이나 임시로 코드를 비활성화하는 데 사용됩니다. /* 이것은 여러 줄 주석입니다. */ // 이것은 한 줄 주석입니다. 3. CSS 주석 처리: - CSS에서 .. 2023. 7. 20.
div 태그 - 일단 큰 덩어리를 나눠 놓을 것 [HTML, JavaScript] div 태그를 사용하는 건 SEO 때문이야? 아니면 또 다른 의의가 있나? `div` 태그는 HTML에서 블록 레벨의 컨테이너 역할을 하는 가장 일반적인 요소 중 하나입니다. 이것은 레이아웃과 스타일링을 위해 사용되며, 특정 의미를 가지지 않는 "무의미한" 컨테이너로 사용됩니다. `div` 태그의 주요 용도와 의미는 다음과 같습니다: 1. 레이아웃 및 스타일링: `div` 태그는 레이아웃과 스타일을 적용하기 위해 주로 사용됩니다. 웹 페이지의 다양한 섹션, 레이아웃 영역, 컨테이너 등을 정의하는 데에 이용됩니다. 2. 구조화: `div` 태그는 구조화된 방식으로 웹 페이지의 다양한 부분을 분리하는 데 사용됩니다. 다른 의미를 가지는 태그들로 적절하게 묶어서 웹 페이지의 .. 2023. 7. 20.
table 태그 기본 table 태그에 대해 중학생 수준으로 설명해. 헤더 셀 헤더 셀 데이터 셀 데이터 셀 데이터 셀 데이터 셀 HTML에서 table 태그는 표를 만들 때 사용되는 태그입니다. 표는 행과 열로 구성되며, 데이터를 구조화하여 표시할 때 유용합니다. table 태그는 다음과 같은 구조로 사용됩니다: ``: 표 전체를 감싸는 가장 바깥쪽 태그입니다. ``: 표의 행(row)을 나타내는 태그입니다. `table` 태그 내에 위치해야 하며, 각각의 행은 `` 태그로 감싸집니다. ``: 표의 헤더 셀(header cell)을 나타내는 태그입니다. 표의 첫 번째 행(``)에서 사용되며, 일반적으로 굵은 글씨로 표시됩니다. ``: 표의 데이터 셀(data cell)을 나타내는 태그입니다. 표의 내용을 담고 있는 셀로, .. 2023. 7. 20.
HTML 문서의 기본 구조에 대한 설명 위의 코드는 HTML 문서의 기본적인 구조를 나타내고 있습니다. 각 요소가 왜 필수적인지에 대해 자세히 설명하겠습니다. 1. ``: 이 부분은 문서의 유형을 지정하는 것으로, HTML 문서임을 나타냅니다. 이것은 웹 브라우저에게 문서가 HTML 형식임을 알리는 역할을 합니다. "웹 브라우저에게 문서가 HTML 형식임을 알리는" 일이 왜 중요한데? "웹 브라우저에게 문서가 HTML 형식임을 알리는" 일은 중요한 이유가 있습니다. 여기에는 몇 가지 이유가 있습니다: 1. 올바른 렌더링: 웹 브라우저는 웹 페이지를 해석하고 렌더링하여 사용자에게 보여줍니다. HTML 문서는 웹 페이지의 구조와 내용을 정의하는 역할을 합니다. 올바른 HTML 형식으로 작성된 문서는 웹 브라우저가 문서를 정확하게 이해하고 제대로 .. 2023. 7. 20.
진짜 웹개발로 배우는 실용 자바스크립트 1강~(코딩애플) https://www.youtube.com/watch?v=8rv8GTgYYrU&list=PLfLgtT94nNq0svPBSslzReYKbZRuv_-NK&index=1 필기 웹 환경에서 JavaScript의 목적은 HTML를 조작하고 변경하기 위해서임. 이것만 기억해도 됨. (예) document.getElementByID('hello').innerHTML='안녕'; :(웹)문서의 어쩌구 저쩌구. 쩜(.)은 "~의"라고 해석하면 됨 이퀄(=)은 코딩에서 오른쪽에 있는 거를 왼쪽에 "대입한다"는 뜻임. 따옴표는 '문자'를 담을 때 쓰는 거임 documet.... ) : 이걸 selector 라고 함 innerHTML : 이건 구글에서 검색해서 찾아야 함. (이 코드로 HTML의 거의 모든 요소를 변경시킬 수 .. 2023. 7. 20.
원목 맞춤제작 견적 의뢰서 페이지 구축 새 디자인 원목 맞춤제작 견적 의뢰서 페이지 구축 개발 첫 단추로써, 대략 어떤 형태가 되어야 할 지 다시 그려봤다. (Google Sheets로.) HTML, CSS, JavaScript, 여러 API를 활용해서 되도록 빠르게 빌드하고, 주석을 충분히 많이 달도록 해서, 계속적인 학습이 이뤄지도록 한다. 각 요소별 동작방식을 간단히 시뮬레이팅해보면 이렇다. 로고와 타이틀은 사용자에 의해 삭제 및 교체 가능하게 만든다. 타이틀은 다른 이름을 입력할 수 있게 하되 삭제는 불가능하게. 의뢰자 / 받을 주소 / 이메일 / 전화번호는 '데이트 유효성 검사'를 적용. 아이템 종류는 팝업창의 '트리뷰' 형태로 선택 가하도록. 원하는 스타일은 슬라이드뷰 방식을 통해 선택 가능하도록. (각 스타일별 대표 이미지와 간단한 설명이 .. 2023. 7. 19.
예약 캘린더 구축 : 테이블 태그 또는 캘린더 라이브러리 1 [웹 개발] 손님(=의뢰자)가 날짜를 클릭해서 약속이나 예약을 할 수 있는 캘린더 페이지를 구축한다면 이 캘린더 구축에도 '테이블 태그'가 활용될 수 있겠구나? chatGTP 네, 캘린더 페이지를 구축할 때에도 '테이블' 태그를 활용할 수 있습니다. 캘린더는 날짜와 해당 날짜에 예약이나 약속이 있는지를 표시하는 데 사용되는 일반적인 방법 중 하나입니다. 테이블을 사용하여 캘린더를 만들면 각 날짜를 행과 열로 구성된 테이블 셀에 표시할 수 있습니다. 일반적인 방법으로 캘린더를 구축하는 경우, 다음과 같은 방법으로 테이블을 활용할 수 있습니다: 1. 테이블 구조: 각 날짜를 행과 열로 표현하는 테이블 구조를 생성합니다. 행은 일주일(7일)을 나타내며, 열은 요일을 나타냅니다. 이렇게 테이블을 구성하면 사용자.. 2023. 7. 19.
테이블과 스프레드시트 [웹 개발] JavaScript와 Quill로 텍스트 편집기 또는 포스트 편집 메커니즘을 구축하고 있어. 웹 개발 차원에서 '스프레드시트'와 '테이블'의 개념 차이를 설명해 줘. chatGTP 웹 개발에서 '스프레드시트'와 '테이블'은 두 가지 다른 개념을 나타냅니다. 1. 테이블: 테이블은 웹 페이지에서 데이터를 구조화하고 표시하는 데 사용되는 요소입니다. HTML에서 `` 태그를 사용하여 테이블을 만들 수 있습니다. 테이블은 행(row)과 열(column)로 구성되며, 각 셀(cell)에 데이터를 포함시킬 수 있습니다. 주로 정렬된 데이터를 표 형태로 표시하는 데 사용됩니다. 테이블은 웹 개발에서 데이터를 표시하고 조작하는 데 널리 사용됩니다. 예를 들어, 데이터베이스에서 검색 결과를 표 형태로 표시.. 2023. 7. 19.
채팅 기능 구축에 필요한 도구와 라이브러리 [JavaScript, React] 내가 구축할 페이지에 채팅 기능을 구축하려면 어떤 도구, 어떤 라이브러리가 필요한가? 채팅 기능을 구축하기 위해 JavaScript와 React를 사용할 경우, 다음과 같은 도구와 라이브러리가 유용할 수 있습니다: 1. WebSocket: 실시간 양방향 통신을 구현하기 위해 WebSocket을 사용할 수 있습니다. WebSocket은 클라이언트와 서버 간의 지속적인 연결을 제공하고, 실시간 메시지 교환에 적합한 프로토콜입니다. 2. Socket.IO: Socket.IO는 WebSocket을 더욱 쉽게 사용할 수 있도록 도와주는 라이브러리입니다. Socket.IO는 WebSocket의 대안으로 폴링 등 다양한 전송 방식을 지원하여 크로스 브라우저 호환성을 향상시킵니다. .. 2023. 7. 19.
Quill 테스트 1 │정상 작동 [웹 개발] JavaScript와 Quill을 이용하여 간단한 '서식 있는 텍스트 편집기'를 구축하는 코드를 써 줘. 가로 1200px, 세로 900px의 I/O 박스(=페이지)에 커서가 다가가면 '텍스트 편집기로 입력하기' 버튼과 '이미지 편집기로 입력하기' 가 나타나고, 이 두 버튼 중에 '텍스트 편집기로 입력하기'를 누르면 입력 대기 상태로 변해서 키보드로 글을 입력할 수 있게 해줘. (코드 작성할 때 충분한 주석을 달아서 써 줘.) chatGTP 아래는 JavaScript와 Quill을 사용하여 웹 페이지에 간단한 서식 있는 텍스트 편집기를 구축하는 코드입니다. 코드 주석에 상세한 설명을 포함시켰습니다. 위 코드를 HTML 파일에 저장하고 웹 브라우저에서 실행하면 가로 1200px, 세로 900p.. 2023. 7. 19.
Github 1Gb까지 무료 호스팅 구축된 웹페이지를 릴리즈할 때, 정석으로 호스팅 업체를 통하지 않고, Github를 통해 케이스 바이 케이스로 해당 페이지를 공유할 수도 있지? Bard 네, 구축된 웹페이지를 릴리즈할 때, 정석으로 호스팅 업체를 통하지 않고, Github를 통해 케이스 바이 케이스로 해당 페이지를 공유할 수 있습니다. Github Pages는 Github에서 제공하는 무료 웹 호스팅 서비스입니다. Github Pages를 사용하면 Github에 저장된 웹 사이트를 온라인으로 배포할 수 있습니다. Github Pages를 사용하려면 다음 단계를 따르세요. Github 계정을 만듭니다. Github에 웹 사이트를 저장합니다. Github Pages를 활성화합니다. Github Pages를 활성화하면 Github에 저장된 .. 2023. 7. 19.
quill을 다운로드 및 설치하는 방법 내 컴퓨터에 quill을 다운로드 및 설치하는 방법을 쉽게 순서대로 가르쳐줘. 네, Quill을 다운로드 및 설치하는 방법은 다음과 같습니다. 1. Quill의 웹사이트에 접속합니다. 2. "Download" 버튼을 클릭합니다. 3. "Quill.min.js" 파일을 다운로드합니다. 4. 다운로드한 "Quill.min.js" 파일을 원하는 위치에 저장합니다. 5. Quill을 사용할 HTML 파일의 head 태그 사이에 다음과 같은 코드를 추가합니다. head 태그 사이에 이제 Quill을 사용할 수 있습니다. 2023. 7. 19.
작성 완료 상태에서 링크 삽입? 나는 JavaScript와 Quill로 텍스트 편집기를 구축 중인데, 작성 완료된 글을 수정하지 않은 채 특정 버튼을 클릭하여 글의 특정 요소(글/이미지)에 링크를 첨부하는 프로토콜을 구축할 수 있을까? Bard 네, 가능합니다. JavaScript와 Quill로 텍스트 편집기를 구축하는 경우, 특정 버튼을 클릭하여 글의 특정 요소(글/이미지)에 링크를 첨부하는 프로토콜을 구축할 수 있습니다. 프로토콜을 구축하는 방법은 다음과 같습니다. 텍스트 편집기에 특정 버튼을 생성합니다. 버튼을 클릭하면 링크를 삽입할 수 있는 대화 상자를 표시합니다. 대화 상자에서 링크의 URL과 텍스트를 입력합니다. '링크 추가' 버튼을 클릭하면 링크가 삽입됩니다. 이 프로토콜을 사용하면 작성 완료된 글을 수정하지 않은 채 특정.. 2023. 7. 19.
CSS를 배울 수 있는 유튜브 채널 보호되어 있는 글 입니다. 2023. 7. 19.
TypeScript로 다시 쓰는 연습을 하면 도움이 되나? [TypeScript 학습] 뻔한 얘기 말고, 진짜 효과적인 Tip을 알려줘. JavaScript로 쓴 코드를 TypeScript로 다시 쓰는 연습을 하면 도움이 되나? Bard 네, JavaScript로 쓴 코드를 TypeScript로 다시 쓰는 연습을 하면 도움이 됩니다. TypeScript는 JavaScript의 확장 언어이기 때문에, TypeScript로 코드를 작성하면 JavaScript 코드와 호환됩니다. 따라서, TypeScript로 코드를 작성하면 JavaScript 코드의 타입을 명시할 수 있어 코드의 오류를 줄이고 유지 관리하기 쉽게 만들 수 있습니다. JavaScript로 쓴 코드를 TypeScript로 다시 쓰는 연습을 하는 방법은 다음과 같습니다. JavaScript로 쓴 코드를 .. 2023. 7. 19.
Fusion360 렌더링 API가 있나? [웹 개발] 이미지 편집기를 구축 중인데, 이 편집기에서 활용할 수 있는 Fusion360 렌더링 API가 있나? Bard 네, Fusion 360에는 웹 개발을 위한 렌더링 API가 있습니다. 이 API를 사용하면 Fusion 360 모델을 웹 브라우저에서 렌더링하고 시각화할 수 있습니다. API를 사용하려면 Fusion 360 웹 렌더링 API를 참조하십시오. Fusion 360 웹 렌더링 API는 다음과 같은 기능을 제공합니다. Fusion 360 모델을 웹 브라우저에서 렌더링합니다. 모델의 다양한 뷰를 렌더링합니다. 모델의 재질 및 조명을 조정합니다. 모델의 애니메이션을 생성합니다. Fusion 360 웹 렌더링 API는 웹 개발자들에게 강력한 도구를 제공합니다. 이 API를 사용하면 Fusion.. 2023. 7. 19.

티스토리툴바