본문 바로가기

코딩/웹 프로그래밍

(6)
인스타그램 멀티링크용 링크트리 페이지 코딩으로 만들기(3) 안녕하세요. 링크트리 페이지 코딩으로 만들기 3탄입니다. 1탄과 2탄은 아래 링크를 참고해주세요. 2022.08.01 - [코딩/웹 프로그래밍] - 인스타그램 멀티링크용 링크트리 페이지 코딩으로 만들기(1) 인스타그램 멀티링크용 링크트리 페이지 코딩으로 만들기(1) 안녕하세요. 오늘은 인스타그램프로필에서 여러개의 링크를 걸기 위해 사용하는 링크트리 페이지를 따라 만들어보겠습니다. 우선 멀티링크, 링크트리가 무엇인지부터 확인해보겠습니다. 개인 bebutae.tistory.com 2022.08.11 - [코딩/웹 프로그래밍] - 인스타그램 멀티링크용 링크트리 페이지 코딩으로 만들기(2) 인스타그램 멀티링크용 링크트리 페이지 코딩으로 만들기(2) 안녕하세요. 링크트리 페이지 코딩으로 만들기 2탄입니다. 우리는..
인스타그램 멀티링크용 링크트리 페이지 코딩으로 만들기(2) 안녕하세요. 링크트리 페이지 코딩으로 만들기 2탄입니다. 우리는 HTML과 CSS로 코딩한 페이지를 깃허브 저장소에 올리고, Netlify를 깃허브 저장소에 연동시켜 웹페이지를 배포할 예정입니다. 1탄에서는 링크트리 페이지를 HTML과 CSS로 코딩해보았습니다. 2022.08.01 - [코딩/웹 프로그래밍] - 인스타그램 멀티링크용 링크트리 페이지 코딩으로 만들기(1) 인스타그램 멀티링크용 링크트리 페이지 코딩으로 만들기(1) 안녕하세요. 오늘은 인스타그램프로필에서 여러개의 링크를 걸기 위해 사용하는 링크트리 페이지를 따라 만들어보겠습니다. 우선 멀티링크, 링크트리가 무엇인지부터 확인해보겠습니다. 개인 bebutae.tistory.com 2탄에서는 코딩한 페이지를 깃허브 저장소에 올려보겠습니다. 깃허브를..
인스타그램 멀티링크용 링크트리 페이지 코딩으로 만들기(1) 안녕하세요. 오늘은 인스타그램프로필에서 여러개의 링크를 걸기 위해 사용하는 링크트리 페이지를 따라 만들어보겠습니다. 우선 멀티링크, 링크트리가 무엇인지부터 확인해보겠습니다. 개인 인스타그램 게시글에는 링크를 걸 수 없습니다. 프로필에는 링크를 걸 수 있는데 하나만 걸 수 있습니다. 그래서 블로그와 유튜브, 마플샵 등 다양한 페이지를 운영중인 경우 여러 페이지 중 하나의 페이지만 링크를 걸 수 있습니다. 예를 들면 아래와 같이 인스타그램 프로필에는 하나의 링크만 걸 수 있습니다. 하지만 저 링크에 접속하면? 이렇게 네이버 블로그와 굿즈샵, MBTI 테스트 페이지의 링크가 걸려있는 페이지로 접속할 수 있습니다. 오늘 웹 프로그램이을 통해 만들어볼 페이지가 바로 이렇게 여러개의 링크가 모여있는 멀티링크 페이지..
Vue - Vue가 뭔가요?, Vue 설치하기 안녕하세요. 오늘은 VUE에 대해서 알아보도록 하겠습니다. 1. 3대 프레임워크 프레임워크는 다양한 기능을 가진 클래스와 라이브러리의 모음집입니다. 쉽게 말하자면 특정 목적을 달성하기 위한 도구모음집이라고 할 수 있습니다. 자바스크립트 생태계에서 React, Angular, Vue는 프론트엔드 3대 프레임워크로 불립니다. 그 중에서도 Vue는 가장 쉬운 프레임워크를 표방하며 조금더 낮은 진입장벽을 가진 프레임워크로 웹 앱을 만들고싶으실때 선택하시면 됩니다. 참고로 React는 사용자수가 가장 많은 프레임워크입니다. 2. Vue를 쓰는 이유 앞서 이야기했듯 Vue는 가장 쉬운 프레임워크를 표방합니다. Vue를 쓰는 이유도 정말 단순하게 쉬워서 입니다. 결과물도 다른 프레임워크와 다르지 않기때문에 다른 목적..
HTML[2] - 주요 태그 배우기 안녕하세요. 오늘은 HTML의 핵심인 태그에 대해 배워보겠습니다. 지난 게시글에서 저희는 HTML이 뭔지, 태그의 구조는 뭔지 알아보았습니다. 이번시간에는 태그에 대해서 조금 더 자세히 알아볼겁니다. 먼저 간단히 말씀드리자면, 태그는 마크다운 언어에서 가장 핵심역할을 하는 요소입니다. 앞뒤로 텍스트를 감싸 다양한 옵션을 부여하며 문서의 구조를 만들어줍니다. 그러니 태그의 종류를 잘 알아두셔야 만들고자 하시는 문서를 적절히 구조화하실 수 있습니다. 1. 주요 태그의 종류 (1) head 헤드 태그는 말그대로 문서의 머리 영역을 지정해주는 태그입니다. 문서의 정보와 외부 문서와의 연결링크 등을 담고있는 영역이며 타이틀도 포함하고 있습니다. 아래 사진을 예시로 보자면, 헤드 태그에 메타 태그가 들어있고, 인코..
HTML[1] - HTML이란? 안녕하세요. 오늘은 HTML에 대해 알아보겠습니다. 1. HTML이란? HTML은 HyperText Markup Language의 약자로, 웹페이지를 만들기 위한 마크업 언어를 의미합니다. 마크업 언어는 문서내에 문장이나 그림, 표 등이 어떻게 배치되는지, 글자는 어떤 크기와 모양을 갖고 있는지에 대해 나타내는 언어로써, 쉽게 말해 웹페이지의 골격을 만들어주는 언어입니다. 프로그래밍 언어인 파이썬이나 C언어는 기계에 명령이나 연산을 시키는 목적으로 사용되지만, 마크업 언어인 HTML은 웹페이지의 구조를 만드는 역할만 할수 있습니다. 프로그래밍 언어는 실행을 위한 언어라면, HTML은 표현을 위한 언어라고 할 수 있겠네요. HTML은 태그와 속성, 내용과 요소로 이루어져있는데 여기서 태그는 명령어의 집합이..