코딩 학원(국비지원)/개인 프로젝트 썸네일형 리스트형 카페24 도메인 기간 만료, 연장 비용 85배 증가?! 카페24 도메인 기간 만료 작년 6월, 개인프로젝트 웹 페이지(https://dioweb.shop/)에 사용할 도메인을 카페24에서 구매했다. 당시 이벤트로 550원을 주고 구매했다. 도메인명은 '. shop'이었다. 1년에 550원이라니 비용이 참 저렴하다 생각했다. 1년이 지나고도 다시 연장할 생각이었다. 그렇게 1년이 지나고 도메인 만료일이 다가왔다. 도메인 연장비용...예상을 뛰어넘는 연장비용이 나왔다. 카페24 도메인 연장비용은 46,750이다. 550원에서 무려 85배가 증가한 금액이다. 당연히 연장하지 않을 것이다. 다른 도메인을 사용하면 월 2만 원 정도만 지출하면 된다. 아무리 이벤트로 혜택을 줬다고 하지만 연장비용이 괴랄하다. 작년 카페24의 영업이익은 -31억 원으로 적자였다. 이.. 더보기 [항해 플러스 코육대 토이프로젝트] 세뱃돈 계산기 만들기 계산기를 만드는 과정 0. SPRING, HTML, CSS, JAVASCRIPT를 사용하여 세뱃돈 계산기를 만들었다. 1. 계산기 뼈대는 table 태그를 사용했다. 1x4 테이블을 7줄 만들었다. display(입력) 병합 후 input 태그를 만들어줬고, result(결과) 부분도 병합후 input 태그를 만들어줬다. 각 테이블의 데이타를 클릭하면 onclick 이벤트가 발생하고 각 데이터에 맞는 문자(char)를 입력칸에 add 한다. AC C / 7 8 9 * 4 5 6 - 1 2 3 + 0 . = 2. reset1() - AC버튼, reset2() - C버튼 , add() - 입력, calculate() - 출력에 해당하는 javascript 함수를 만들어준다. 3. 가을 느낌의 계산기로 CSS.. 더보기 도메인이란 무엇인가? cafe24에서 도메인 구매, 사이트 연결하기 도메인(domain)이란? 우리가 찾는 사이트를 쉽게 찾아갈 수 있도록 언어로 만든 주소를 말한다. ex: https://www.naver.com/ 도메인은 왜 생겼나? 전화걸 때 상대방 전화번호를 눌러야 전화를 걸 수 있는 것과 비슷하다. 사이트는 본래 IP 주소를 가지고 있다. IP 주소는 0~255까지 숫자를 점 3개로 연결한다. 125.209.222.141 가 예시다. 사이트를 접속할 때마다 IP주소를 외워서 접속하는 것은 매우 번거롭다. 우리가 자주 전화 거는 사람들의 번호를 다 외우지 않고 단축키로 등록하거나 이름을 지어주는 것처럼 IP 주소대신 텍스트와 IP주소를 결합하여 저장한다. 이곳을 DNS(Domain Name System)라고 한다. 사용자가 네이버에 접속하려고 url을 입력하면 D.. 더보기 개인 프로젝트 웹사이트 배포하기 (netlify) 개인프로젝트 웹사이트 배포하기 (netlify) 아마존 AWS를 이용해서 개인프로젝트를 deploy(인터넷에 웹사이트를 올리는 행위를 말함.)할까 했는데 더 쉬운 방법이 있었다. netlify를 이용하면 5분 안에 사이트 배포가 가능하다. Netflify는 웹 호스팅 서비스를 제공한다. 웹사이트 배포는 매우 간단하다. Github에 저장소를 만들고, HTML, CSS, javascript 코드를 저장한다. 저장된 코드를 netflify를 이용하여 디플로이 한다. 깃헙과 연결해 두면 소스코드를 수정하는 데로 즉각 반영되기 때문에 다시 파일을 올리는 번거로움이 없다. github과 연결하지 않고 index.html 파일만 업로드 해도 배포가 가능하다. 그러나 수정하고 다시 파일을 올려야 하는 번거로움이 있다.. 더보기 구글 코랩(Google Colab)으로 만든 배당금 종합 프로그램 배당금 종합 프로그램 import matplotlib.pyplot as plt plt.rc('font', family='NanumGothic') dividends = [] # 배당금 리스트 초기화 # 사용자로부터 배당금 정보 입력받기 while True: stock = input("주식 이름을 입력하세요 (종료하려면 'q' 입력): ") if stock == 'q': break amount = float(input("배당금을 입력하세요: ")) dividends.append((stock, amount)) # (주식 이름, 배당금) 튜플을 리스트에 추가 # 배당금 정리 및 총 수익 계산 total_dividend = 0.0 print("\n dividend :") for stock, amount in di.. 더보기 수직 스크롤 발생 시 header 태그에 active 클래스 추가 및 삭제 수직 스크롤 발생 시 header 태그에 active 클래스 추가 및 삭제 코드 // 수직 스크롤 발생 시 header 태그에 active 클래스 추가 및 삭제 (function(){ const headerE1 = document.querySelector("header") window.addEventListener("scroll", function(){ this.requestAnimationFrame(scrollCheck); }); function scrollCheck(){ const browserScrollY = window.scrollY ? window.scrollY : window.pageYOffset; if(browserScrollY > 0){ headerE1.classList.add('activ.. 더보기 동적 페이지 만들기. javascript 코드. 동적페이지 만들기 Javascript 코드 (function(){ const spanE1 = document.querySelector("main h2 span"); const txtArr = ['Web publisher', 'Front-End Developer', 'Web UI Designer', 'UX Designer', 'Back-END Developer']; let index = 0; let currentTxt = txtArr[index].split(""); console.log(currentTxt); function writeTxt(){ spanE1.textContent += currentTxt.shift(); if(currentTxt.length !==0){setTimeout(writeTxt, .. 더보기 정적 페이지 완성, 미디어 쿼리 적용 1. HTML, CSS만을 이용하여 정적 페이지는 완성했다. 2. 이제는 미디어쿼리를 이용하여 동적 페이지를 만들어보자. 미디어 쿼리는 특정 영역에만 CSS를 적용할 때 사용한다. if문과 비슷하다. 반응형 웹사이트를 만들 때 주로 쓰는데 화면크기가 줄어들면 거기에 맞춰 main, section 영역이 같이 줄어든다. @media screen and (max-width: 1140px){ main .contatiner{ width:992px; } section .container{ width:600px; } section .about-self .left{ width: 100% ; } section .about-self .right{ width: 100%; padding: 0; } section .do-me.. 더보기 이전 1 2 다음
