목록웹 개발 (57)
가수면
함수의 기본 작동 원리 const f = function (아무거나) { # 점프 return 아무거나 + 5 } consol.log(f(1)) # 6 1. 함수는 건너뛰고 consol.log를 인식한다. 2. 점프 구간으로 넘어가 내용물을 리턴값으로 리턴한다. 간단한 응용 const sum = function (limit) { let output = 0 for (let i = 1; i value) { output = value } console.log(`= ${output}`) } return output } console.log(min([52, 273, 32, 103, 275, 24, 57])) # 처음 실행 때의 output = 52 # 현재 비교 대상 52과 52 중에 더 작은 것은? # = 52..
.splice() 배열 중간에 요소 추가하기: splice(인덱스, 0, 요소) 배열 요소 제거하기 .splice(인덱스, 1) .indexOf() 배열 내부에서 값의 위치 찾기 a = [52, "추가", 273, "안녕", "하세요", 100] a.indexOf('안녕') 3 # 없는 요소를 찾을 경우 a.indexOf('777') -1 둘의 응용 const index = a.indexOf('하세요') a.splice(index, 1) [52, "추가", 273, "안녕", 100] slice( ) vs splice( ) slice() - 원본을 복사한 배열객체를 반환 splice() - 원본 배열객체를 직접 수정 for of const 배열 = ['바나나', '사과', '귤'] for (const 요..
프로젝트 중이던 폴더의 경로를 바꾼 경우, 아래 사진과 같이 '프로젝트에 잘못된 Python 인터프리터가 선택되었습니다'라는 문구가 뜸과 동시에 파일이 먹통이 된다. 해결하는 방법은 다음과 같다. 인터프리터 없음으로 설정해준 뒤 확인을 누르면, 위와 같은 메시지가 뜨는데 파란색 밑줄쳐진 부분을 누르면 패키지들이 자동으로 설치되며 해결된다. 인터프리터 구성으로 직접들어가 설정을 해보려고 했지만 이 방법은 무엇 때문인지 먹히질 않았다.
switch 조건문 이제는 잘 쓰이지 않지만, 남이 써 놓은 코드를 보는 게 일인 개발자로선 알아둬야 할 필요가 있음. 아래는 기본 형태. const x = Number(prompt('숫자를 입력해주세요', '')) switch (x) { case 1: alert('입력한 값이 1입니다.') break case 2: alert('입력한 값이 2입니다.') break case 3: alert('입력한 값이 3입니다.') break default: alert('입력한 값이 1-3이 아닙니다.') } 조건부 연산자 (=삼항 연산자) ㅇㅇ ? ㅇㅇ : ㅇㅇ 불 표현식 ? 참일 때의 결과 : 거짓일 때의 결과 예시1) const x = Number(prompt('숫자를 입력해주세요', '')) alert((x >..
기본 용어 및 개념 표현식 = 값을 만들어내는 간단한 코드 문장 = 표현식이 모인 것 키워드 = 특별한 의미가 있는 단어들 (ex. for, if ····.) 식별자 = 변수명, 함수명(숫자로 시작하면 안 됨) 문자열 자료형 큰따옴표("), 작은따옴표('') 문자열 의미 통일 권장 (내부 외부에 동시 사용하고자 할 경우 혼용 가능) 이스케이프 문자 \n = 줄 바꿈 >'동해물과 백두산이\n마르고 닳도록' "동해물과 백두산이 마르고 닳도록" \t = 탭 >'이름/t나이/t지역 "이름나이지역" \\ = \ 불 자료형 true, false, 비교 연산자, &&(논리곱), ||(논리합) 템플릿 문자열 백틱으로 감싼 문자열 내부에 ${표현식}을 넣으면 문자열 내부에서 표현식이 계산됨 자료형 변환 prompt() ..
목표. 메인페이지(index.html)에서 버튼 등을 클릭해 premovies.html의 화면으로 넘어가기 1) app.py에 추가 @app.route('/') def home(): return render_template('index.html') 위와 같은 기본 코드 아래로 다음과 같은 내용을 추가해준다. # 'pre-movies'는 넘어갈 페이지 주소 @app.route('/pre-movies') def premovies(): return render_template('premovies.html') 2) html에 반영 상영예정작 보너스) 새로고침 상영예정작 상영예정작 페이지에서 다시 상영예정작을 눌렀을 때 새로고침이 된다.
1. repository 만들기 2. git bash 에서 환경설정 하기 (한 번만 하고 이후부턴 3번 과정부터 하면 되는 듯)2-1.유저이름 설정git config --global user.name "your_name"2-2. 유저 이메일 설정하기git config --global user.email "your_email"2-3. 정보 확인하기git config --list 3. github에 업로드하기 (터미널에 입력)3-1. 초기화 (처음 한 번만)git init3-2. 추가할 파일 더하기# 전부git add .# 지정 파일git add 파일명.확장자3-3. 상태 확인 (선택사항)git status3-4. 히스토리 만들기git commit -m "first commit"3-5. Github repo..
전체적으로 어렵진 않았으나 함수, 클래스와 객체, 배열 연습 부분은 다시 복습해볼 필요가 있음. *문자열 붙이기* 문자열과 숫자를 이어붙이면 숫자가 문자로 인식된다 console.log('1'+2) 12 *증감연산자* 증감연산자의 위치 # 증감연산자를 앞에 놓을 때 let count = 1 const preCount = ++count console.log(`count: ${count}, preCount: ${preCount}`) count: 2, preCount: 2 # 증감연산자를 뒤에 놓을 때 let count = 1 const preCount = count++ console.log(`count: ${count}, preCount: ${preCount}`) count: 2, preCount: 1 *대..
1. '가비아'에서 사이트 구매하기 2. Amazon EC2 만들기 2-1. Amazon EC2 들어가기 2-1. 인스턴스 시작>이름 입력>Ubuntu Server 20.04>t2.micro 새 키 페어 생성>이름, RSA, .pem으로 생성>인스턴스 시작 ※ 인스턴스 중지(컴퓨터 끄기), 인스턴스 종료(컴퓨터 반납), 1년 1대 무료(무료 기간 후 결제가 되기 전 종료 필요) 3. Git Bash 세팅 (처음에만. 이후에는 ↑ 방향키 눌러 3-3 명령어로 접속하면 됨. 띄어쓰기 주의!) 3-1.Git Bash 실행 3-2. sudo chmod 400 (400뒤로 .pem파일 끌어넣기. 맥 전용) 3-3. ssh -i (키페어 끌어넣기) ubuntu@(인스턴스 '퍼블릭 IPv4 주소' 붙여넣기) 3-4...
*여러 페이지 만들기* # http://localhost:5000/ @app.route('/') def home(): return render_template('index.html') # http://localhost:5000/mypage @app.route('/mypage') def mypage(): return render_template('mypage.html') *서버 준비* 1. html 읽어오기 from flask import Flask, render_template app = Flask(__name__) @app.route('/') def home(): return render_template('index.html') if __name__ == '__main__': app.run('0.0.0..
-자바스크립트- 홀짝 함수 let count = 0 function hey() { count += 1 if (count % 2 == 0) { alert('짝수입니다') } else { alert('홀수입니다') } } -JQuery- *JQuery 추가* *기타 메모* class = css id = JQuery *JQuery 코드들* # 가져오기 $('#url').val() # 보이기 $('#post-box').show() # 숨기기 $('#post-box').hide() $('#id')(id에 JQuery를 먹인다).val('홍길동')(id에 홍길동이라는 value를 넣는다) *연습 1* function q1() { let a = $('#input-q1').val() if (a == '') { aler..
드디어 코로나의 마수로부터 어느 정도 해방되어 살만해졌다. 혼미했었던 정신을 털어내고 복습하는 시간을 갖도록 해보자. html 기본 양식 # 브라우저 네모 창 안에 들어가는 애들 나는 구역을 나누죠 나는 문단이에요 bullet point!1 bullet point!2 h1은 제목을 나타내는 태그입니다. 페이지마다 하나씩 꼭 써주는 게 좋아요. 그래야 구글 검색이 잘 되거든요. h2는 소제목입니다. h3~h6도 각자의 역할이 있죠. 비중은 작지만.. span 태그입니다: 특정 글자를 꾸밀 때 써요 a 태그입니다: 하이퍼링크 img 태그입니다: input 태그입니다: button 태그입니다: 버튼입니다 textarea 태그입니다: 나는 무엇일까요? *연습1* 로그인 페이지 ID: PW: 로그인하기 보완해야 ..
-리눅스 명령어- mkdir = 새 폴더 ls = 현재 폴더 확인 cd 폴더 명(다 쓸 필요 없이 Tab버튼 누르면 자동 완성) = 들어가기 cd .. = 나오기 cp -r 복사할 것 / 붙여넣기 할 것 = 복사 붙여넣기 rm -rf 지울 것 = 지우기 sudo 실행 할 명령어 = 명령어를 관리자 권한으로 실행 sudo su: 관리자 권한으로 들어가기 (나올 때는 exit) 패키지 설치 pip install flask pip install pymongo pip install dnspython python app.py = app.py 켜기 nohup python app.py & = 항상 켜두기 ps -ef | grep 'python app.py' | awk '{print $2}' | xargs kill =..
from pymongo import MongoClient client = MongoClient('mongodb+srv://test@cluster0.q4umm5t.mongodb.net/?retryWrites=true&w=majority') db = client.dbsparta(폴더명) *데이터 저장하는 방법들* 1. 한 개 저장 doc = {'name':'bob','age':27} db.users.insert_one(doc) 2. 여러 개 저장 db.users.insert_one({'name':'bobby','age':27}) db.users.insert_one({'name':'john','age':20}) db.users.insert_one({'name':'ann','age':21}) *데이터 찾기* 1..
단순 지칭 및 첨언 *requests 패키지* import requests (requests 라이브러리 설치 필요) r = requests.get('http://spartacodingclub.shop/sparta_api/seoulair') rjson = r.json() rows = rjson['RealtimeCityAir']['row'] for row in rows: gu_name = row['MSRSTE_NM'] gu_mise = row['IDEX_MVL'] if gu_mise 검사>복사>selector 복사)) print(title) 밥정 print(title['href']) /movie/bi/mi/basic.naver?code=186114 print(title.text) 밥정 *영화 제목, 순위, ..
-자바스크립트- 단순 지칭 중요 *빈칸 채워서 그거 알림 띄우기* function q1() { //입력값 지정하기 let 아무이름 = $('#input-q1(빈칸id임)').val(); //비어있다면 if (value == '') { //알림 띄우기 alert('입력하세요!')} //아니면 임의 값 띄우기 else { alert(value)} } *빈칸에 입력한 yhhnnmm@gmail.com에서 gmail만 띄우기* function q2() { //입력값 지정하기 let 아무이름 = $('#input-q2(빈칸 id임)').val(); //만약 입력값에 @가 있다면 if (email.includes("@") == true) { //@로 나누고, .으로 다시 나눠서 띄우기 alert(email.split..
-프론트 관련- *간격, 여백* margin (외부 간격) padding (내부 간격) *주석 (임시 생략)* 컨트롤+/ *style 세트들* 스타일 백그라운드 이미지 background-image: url("https://w.namu.la/s/385693ee286b4bac439fa5c333d820817d0ad49a150f43f1c4f6aaac1d22a77b7c64865c856ce1ee54b483f8599b252d0dc452041a444108ec1268d1e1efb2794edb7605a195e12d417fa3aba8e038792ea650dc547e98a66e2c76d045fa9734"); background-position: center; background-size: cover; 스타일 글씨 displ..