코딩온라인강의10 정규 표현식 - 수량자 수량자는 문자의 반복 횟수를 설정하는 문법으로, 반복하고 싶은 문자{수량자}의 형태로 사용한다. 반복하고 싶은 문자 부분에는 일반 문자, 집합, 문자 클래스, 메타 문자, 하위 표현식 등이 올 수 있다. 수량자 기본 표현 반복 횟수를 대괄호 안에 넣어서 {n}과 같은 형태로 사용하는 것이 기본이다. ex) 네 자리 숫자가 연속으로 오는 경우를 찾고 싶을 때 \d{4} 외에 아래와 같이 써도 동일한 결과를 얻을 수 있다. [0-9]{4} [0123456789]{4} \d\d\d\d [0-9][0-9][0-9][0-9] [0123456789][0123456789][0123456789][0123456789] 수량자 범위 지정 수량자를 {min,max} 형태로 사용하면 {최소값, 최대값} 사이의 경우를 찾는다... 2023. 7. 4. JSON 문법과 자바스크립트 객체 표기법 비교 JSON 문법과 자바스크립트 객체 표기법의 공통점과 차이점에 대해서 정리해 보았다. JSON 문법이란? 구글 홈페이지에 request를 보내면 서버가 아래와 같이 html과 javascript로 이루어진 코드를 response 해준다. 그러면 웹 브라우저가 받은 코드를 해석한 후에 예쁘게 화면에 출력해서 우리에게 보여주는 것이다. 이렇게 request로 받을 수 있는 포멧은 html과 javascript 코드 외에도 여러가지가 있다. 개발자 도구 console 창에 아래와 같이 입력해서 실행하면, html 형식이 아니라 데이터로 추정되는 결과를 response로 받는다. 이것은 JSON 이라고 하는 포맷인데, JavaScript Object Notation의 약자이다. 개발자들이 어떤 정보를 나타낼 때 .. 2023. 5. 3. 다른 코드 불러올 때 사용하는 <link>, <script> 태그 코드잇 학습일기 챌린지가 끝났다. 동기부여도 되고 나름 재미있다고 생각했는데, 새로운 공지가 올라오지 않은 것을 보니 5월에는 챌린지를 진행하지 않는 것 같다. 그래도 뭐, 그거랑은 상관없이 앞으로도 계속 블로그에 공부한 내용을 정리해서 올릴 예정이다. 오늘은 다른 코드를 불러올 때 사용하는 링크(link) 태그와 스크립트(script) 태그에 대해서 소개하려고 한다. 외부에서 파일을 불러올 때는 태그는 외부에서 파일을 불러올 때 사용하는 태그이며, 구글 폰트를 적용할 때에도 link 태그를 사용한다. 파비콘을 지정할 때에도 link 태그를 사용한다. favicon.ico 라는 파일을 서버에 업로드 한 후에 해당 경로를 지정해주면 된다. rel 속성에는 icon 이라고 쓴다. html에서 자바스크립트를 .. 2023. 5. 2. 코드잇 학습일기 Day15. 아이프레임(iframe) 원래 코딩강의는 되도록 평일에 듣고, 주말에는 휴식에만 집중하는 편인데... 이번 주에는 정신이 없어서 학습일기를 한개밖에 쓰지 못했다. 학습일기 챌린지가 주 2회인데, 주말에 1개를 쓰지 않으면 4월 챌린지를 실패하는 상황이라서, 주말이지만 코딩강의를 듣기로 했다. 아이프레임(iframe) 유튜브에서 공유하기(동영상 퍼가기) 기능을 이용할 때 iframe 으로 시작하는 태그를 확인할 수 있다. 아이프레임은 inline frame 이라는 의미이다. 간단하게 설명하자면 html 문서 안에서 또 다른 html 문서를 보여주는 역할을 한다. 개발자 도구를 열어서 보면 태그 안에는 , , 태그가 모두 들어있는 것을 확인할 수 있다. 이것을 응용하여, 만약 어떤 html 화면에서 다른 html 화면을 불러오고 싶.. 2023. 4. 22. 코드잇 학습일기 Day14. 멀티미디어(이미지, 비디오, 오디오) 한동안 바쁜 일이 있어서 코드잇 강의를 듣지 못했다. 더 미루면 이번 주 코드잇 학습일기 챌린지를 할 수 없을것만 같아서, 시간을 쪼개어 모니터 앞에 앉았다. 이미지를 넣을 때 이미지를 넣을 때에는 라는 태그를 사용한다. 태그 안에 src 속성값으로 이미지 경로를 적어주면 된다. 이미지 태그와 함께 사용하는 속성으로 alt가 있는데, 이 곳에는 이미지에 대한 정보를 텍스트로 넣는다. 그러면 마크업만 보고 어떤 이미지인지 알 수 있으며, 이미지를 볼 수 없는 시각장애인용 스크린리더 프로그램에서도 alt에 적혀있는 내용을 읽어준다. 또한 이미지 다운로드에 실패했을 때에도 이 이미지를 보여준다. 이미지를 보지 못해도 어떤 이미지인지 대충 짐작이 가능하기 때문에 사용자를 배려하여 되도록이면 alt 속성을 적어.. 2023. 4. 21. 코드잇 학습일기 Day13. 테이블 태그와 스타일링 요즘 듣는 코드잇의 html 핵심 개념 강의는 기초적인 html 태그들을 소개하고 있다. 이미 알고 있는 내용들을 한 번 더 정리하는 기분으로 듣고 있는데, 설명이 어렵지 않고 퀴즈도 재미있는 편이라 강의를 듣는 시간이 기다려진다. 이 정도면 취미로 코딩 강의를 듣는다고 할 수 있을지도 모르겠다. 표를 그리고 싶을 때 , , 표로 정리된 정보를 나타내고 싶을 때 사용하는 태그에 대해서 알아보도록 하겠다. 표를 그릴 때에는 아래 예제처럼 태그 안에 과 태그를 사용해서 만든다. 태그는 행을 표현하며, 태그는 열을 표현한다. 예전에는 테이블 태그를 이용해서 레이아웃을 나누고 사이트를 꾸미기도 하였는데, 최근에는 flex, grid 등 바람직한 방법들이 있으므로 테이블 태그는 표로 정보를 보여주고 싶을 때에만 .. 2023. 4. 12. 코드잇 학습일기 day12. 리스트 태그와 스타일링 하루 업무를 마치고 퇴근하려다가 오늘 코드잇 강의를 듣지 않았다는 게 떠올라서 다시 모니터 앞에 앉았다. 오늘 강의는 모두 알고있는 내용 들이어서 복습하는 기분으로~ 빠르게 다섯개 강의를 수강할 수 있었다. 순서 있는 리스트 만들기 , 순서가 있는 리스트를 만들 때는 태그 안에 태그를 사용해서 내용을 작성하면 된다. 그렇게 하면 코드에 적혀있는 순서대로 1, 2, 3 숫자로 된 글머리가 생긴다. 순서 없는 리스트 만들기 , 순서가 없는 리스트를 만들 때에는 태그 안에 태그를 사용해서 내용을 작성한다. 이렇게 하면 내용 앞에 자동으로 글머리 숫자 대신, 동그란 모양의 포인트가 생긴다. 리스트 스타일링하기 태그에 type이라는 속성을 주어 리스트 글머리를 어떻게 보여줄지 정할 수 있다. 라고 쓰면 알파벳 소.. 2023. 4. 10. 코드잇 학습일기 Day10. 링크 상대 주소, url 프래그먼트, 새 탭 열기, URI 스킴 오랜만에 다시 돌아온 코드잇 학습일기! 지난 주에도 한 개 쓰고 일주일만인데 엄청 오랜만인 것처럼 느껴진다. (왜지?) 오늘은 링크에 대해서 공부했다. 링크는 태그로 만들 수 있는데, 퍼블리싱을 공부해 본 적이 있다면 정말 필수적으로 공부해야 하는 기초 태그라고 할 수 있다. 링크를 사용하지 않고서는 웹사이트를 만드는 것이 거의 불가능하니까... 그래서 오늘 들은 강의들은 익숙한 내용들이 많았고, 다시 한 번 아는 내용들을 복습할 수 있었던 좋은 기회였다. 어제는 회사 업무가 바빠서 코드잇 강의를 듣지 못했다. 적어도 하루에 강의 한 개 정도는 듣자는 것이 목표이지만, 지키지 못했다고 해서 동기부여에 부정적인 영향을 끼치는 건 더 좋지 않을테니까... 정 못하겠으면 '바빠서 어쩔 수 없었어' 하고 주말에.. 2023. 4. 4. 코드잇 학습일기 Day9. HTML 개념과 구조, 코멘트(주석) 작성 방법 오랜만에 다시 돌아온 코드잇 학습일기~! 2월에 학습일기 챌린지에 참여해서 50,000 네이버 포인트를 받았다. 챌린지가 끝날 줄 알고 있었는데 3월에도 동일한 조건으로 학습일기 챌린지를 진행한다는 사실을 얼마 전에 알았다. 으아, 진작 알았으면 또 참여 하는건데 아쉽...ㅠㅠ 그래서 4월에도 챌린지를 하지 않을까 하는 기대와 그것을 준비하는 워밍업으로 3월 마지막주에 학습일기를 하나 써보기로 했다. 오늘 공부한 내용은 프론트엔드 과정 중 하나인 HTML 핵심 개념 토픽이다. 기초적인 내용이라 부담없이 복습하는 기분으로 듣고, 또 모르는 내용이 나오면 블로그에도 정리해두려고 한다. HTML 의미 HTML은 Hypertext Markup Language의 약자이다. 첫번째 단어인 하이퍼텍스트(Hyperte.. 2023. 3. 27. 재미있는 코딩 교육 서비스 - 코드잇(codeit;) 나는 웹/앱 디자인 업무를 해서인지 코딩&개발에 관심이 많다. 가능하다면 전직도 하고 싶... 그래서 온라인으로 코딩&개발 강의를 듣고 있다. 원래 새로운 것을 배우는 걸 좋아하기도 하고, 또 배워두면 개발자와의 협업에도 도움이 될 것 같아서이다. 무엇보다도 관련 강의들은 정말 흥미진진하고 재미있다. (적성에 맞는건가?) 오늘은 내가 작년부터 만족하며 이용하고 있는 코딩 개발 교육 서비스 - 코드잇(codeit;) 사이트의 장단점과 1월 31일까지 진행하는 친구초대 이벤트를 블로그에 소개해보려고 한다. 코드잇(codeit;)이란? 코드잇은 코딩 교육 서비스를 제공하는 온라인 강의 사이트이다. 컴퓨터 개론부터 웹 퍼블리싱, 파이썬, 자바스크립트, 머신 러닝, 딥 러닝 등의 다양한 코딩&개발 강의를 100%.. 2022. 1. 22. 이전 1 다음