본문 바로가기

분류 전체보기76

[리뷰] 아메리칸 사이코(2000)와 프로그래머 저 미묘한 하얀 색감좀 봐. 딱 맞는 농도까지. 맙소사. 워터마크까지 있잖아. 유튜브를 돌아다니다가 평소 좋아하던 유튜버 Joma Tech(웃기다)의 이 패러디 영상을 보게 되었다. 아메리칸 사이코에서 유명한 다 비슷비슷해보이는 명함을 서로 자랑하다가 주인공인 패트릭 베이트만이 질투에 눈이 멀어 식은땀을 흘리는 영화의 핵심을 관통하는 명장면인데 이것을 재치있게 프로그래머와 키보드로 치환해 패러디했다. 근데 영화를 볼 때에는 다 비슷해보이는 명함 따위에 저렇게 진지하게 열을 올리는 사람들이 웃겨 보였는데 키보드가 되니까 키보드... 중요하지... 이런 기분이 되었다. 해피해킹 사고싶다. 2020. 3. 20.
[django] 장고의 가상환경 가상환경이란 파이썬 코드상의 독립된 공간을 말한다. 사실 가상환경 없이도 장고 서버를 돌리는데 아무런 문제가 없다. 그러나 우리는 보통 개발을 할 때 서버만 돌리는 게 아니라 여러 패키지를 사용하여 다양한 기능들을 구현하게 되는데, 이것들을 설치하면서 패키지간의 충돌이 발생할 수 있기 때문에 안정성을 위해서 가상환경을 사용하는 것이다. 장고에서의 가상환경은 프로젝트의 파이썬과 장고를 분리시켜 주어 다른 프로젝트 또는 파이썬 버전이 해당 프로젝트에 영향을 주지 않게 한다. 가상환경 설치 후 그 안에서 장고를 설치하는 게 순서이다. 먼저 프로젝트 폴더를 만든다. $ mkdir django-sample $ cd django-sample 그 다음 가상환경을 설치하자. pip3 install vertualenv .. 2020. 3. 7.
[html] form 태그에 대해 알아보자 / POST와 GET 차이 태그는 웹 페이지에서의입력 양식을 말한다. 로그인 창이나, 회원가입 폼 등이 바로 태그를 사용하고 있습니다. 이 태그는 입력된 데이터를 한 번에 서버로 전송합니다. 백엔드를 공부하시는 분들도 이 태그에 대해서는 자세히 알아두는 것이 좋습니다. 폼 태그의 기본적인 구성은 다음과 같습니다. First name: Last name: 여기서 을 구성하는 요소들을 하나씩 살펴보도록 하겠습니다. action : 폼을 전송할 서버 쪽 스크립트 파일을 지정 name : 폼을 식별하기 위한 이름 method : 서버에 전송할 http 메소드 (GET 또는 POST) input의 type : 입력받을 요소의 종류를 정한다. number, text, password 등. 반드시 맞는 것으로 입력해 둘 것! label : 폼.. 2020. 2. 15.
[HTML/CSS] display 속성 알아보기 (display:none과 visibility:hidden 차이) display는 요소를 어떤 형태로 나타나게 할 것인지를 말하는 속성으로, 기본적으로 네가지가 있습니다. 최신 웹에선 flex나 grid와 같은 새롭고 편리한 속성들이 등장하지만 브라우저 호환도가 떨어지는 등의 이슈가 있어, 나중에 다루도록 하겠습니다. display : block display : inline-block display : inline display : none display : block 항상 새로운 라인에 요소가 배치되고 화면 크기의 전체 가로폭을 영역으로 차지합니다. width 또는 height 지정을 통해 가로 세로폭을 조절할 수 있습니다. 태그가 기본적으로 block을 기본 display 설정으로 갖습니다. 아래 그림의 배경이 빨갛게 된 부분은 영역으로 기본적으로 display .. 2020. 2. 11.
[Vue.js TIL] 중첩 라우트 / 데이터 바인딩 / computed methods watch의 차이 중첩 라우트 라우터 index.js 에서 다음과 같이 설정해 중첩 라우트를 만들 수 있음. 한 path 아래에 children 속성을 사용하여 다른 Path를 연결함 DATA ={path: '/b/:bid', component: Board, children : [ {path: '/c/:cid', component : Card} ]}, } 그러나 이렇게만 만들고 지정된 화면으로 이동하면 Board 화면만 보이게 됨. Card는 Board의 하위 컴포넌트이기 때문에 Board 컴포넌트에서 Card 컴포넌트가 보일 위치를 지정해 주어야 하기 때문임. 데이터 바인딩하기 데이터는 화면이 created() 된 후에 담을 수 있음. 이 상태에서는 데이터 속성과 메소드 속성은 정의되어 있지만 template의 Dom .. 2020. 2. 3.
[javascript] 자바스크립트 es6 map es6에서 우리는 key-value쌍을 저장하는 Maps라는 데이터 구조체를 사용할 수 있게 되었다. 우리는 어떤 객체든 key 또는 value로 저장할 수 있다. Maps를 사용하기 이전에는 키 값은 string만 사용 가능하지만 value는 무엇이든 들어갈 수 있었다. Maps를 사용하는 것은 간단하다. Maps는 아래 코드와 같이 정의할 수 있다. const superHero = new Map(); superHero.set('Superman', 'Clark Kent'); superHero.set('Batman', 'Bruce Wayne'); 하지만 set을 사용하여 키와 벨류 값을 넣는 대신에 nested array를 사용하여 각 배열의 첫번째 값을 key에 두번째 값을 value에 매칭시킬 수 있.. 2020. 2. 2.
[javascript] 프로그래머스 완주하지 못한 선수 코딩테스트 연습 - 완주하지 못한 선수 | 프로그래머스 수많은 마라톤 선수들이 마라톤에 참여하였습니다. 단 한 명의 선수를 제외하고는 모든 선수가 마라톤을 완주하였습니다. 마라톤에 참여한 선수들의 이름이 담긴 배열 participant와 완주한 선수들의 이름이 담긴 배열 completion이 주어질 때, 완주하지 못한 선수의 이름을 return 하도록 solution 함수를 작성해주세요. 제한사항 마라톤 경기에 참여한 선수의 수는 1명 이상 100,000명 이하입니다. completion의 길이는 partic programmers.co.kr 수많은 마라톤 선수들이 마라톤에 참여하였습니다. 단 한 명의 선수를 제외하고는 모든 선수가 마라톤을 완주하였습니다. 마라톤에 참여한 선수들의 이름이 담긴 배열 par.. 2020. 2. 1.
[python] 백준 알고리즘 2577번 세 개의 자연수 A, B, C가 주어질 때 A×B×C를 계산한 결과에 0부터 9까지 각각의 숫자가 몇 번씩 쓰였는지를구하는 프로그램을 작성하시오. 예를 들어 A = 150, B = 266, C = 427 이라면 A × B × C = 150 × 266 × 427 = 17037300 이 되고, 계산한 결과 17037300 에는 0이 3번, 1이 1번, 3이 2번, 7이 2번 쓰였다. 첫째 줄에는 A×B×C의 결과에 0 이 몇 번 쓰였는지 출력한다. 마찬가지로 둘째 줄부터 열 번째 줄까지 A×B×C의 결과에 1부터 9까지의 숫자가 각각 몇 번 쓰였는지 차례로 한 줄에 하나씩 출력한다. a = int(input()) b = int(input()) c = int(input()) big_number = a * b .. 2020. 2. 1.
[css] 가상 클래스(pseudo-class)와 가상 요소 선택자 (pseudo-element) 가상 선택자CSS에는 가상 요소(:pseudo-element)와 가상 클래스(:pseudo-class)가 있다. 이것들을 사용해서 html 문서의 수정 없이 CSS만으로 디자인적 요소를 추가할 수 있어 html 문서에 쓸데없는 태그를 사용하여 화면 리더기 등에 쓸데없는 정보가 읽히거나 불필요한 클래스를 남발해 코드 가독성을 낮추지 않게 한다. 선택자:가상클래스 { property: value; } 앵커 가상 클래스앵커 가상 클래스는 화면의 특정 요소에 커서가 향했을 때 특정 디자인을 입혀주는 등 어떤 요소에 동적인 스타일을 입혀준다.앵커 가상 클래스에서 가장 자주 쓰이는 패턴이다. :link는 아직 방문하지 않은 링크를 나타낸다. 다음을 사용해서 아직 방문하지 않은 링크를 파란색으로, 방문한 링크는 밑줄.. 2020. 1. 31.