Phot_o_matic Programming

고정 헤더 영역

글 제목

메뉴 레이어

Phot_o_matic Programming

메뉴 리스트

  • 홈
  • 태그
  • 방명록
  • 분류 전체보기
    • Programming
      • TIL
      • Concept
      • Algorithm
      • Hello, stranger
      • Mindchain
      • Python
      • Vue
      • React
      • Git
      • GraphQL
      • Database
      • Twittler
      • Typescript
    • Photography
      • Olympus
      • Canon
    • IT
    • Daily
      • Yummy

검색 레이어

Phot_o_matic Programming

검색 영역

컨텐츠 검색

Programming/Concept

  • fs 모듈 (동기와 비동기) - Nodejs

    2019.05.14 by 쌩우

  • util(deprecate, promisify) - Nodejs

    2019.05.14 by 쌩우

  • crypto 모듈을 이용한 양방향 암호화 - Nodejs

    2019.05.14 by 쌩우

  • crypto 모듈을 이용한 단방향 암호화(hash) - Nodejs

    2019.05.14 by 쌩우

  • RESTful API

    2019.05.06 by 쌩우

  • 가상 선택자 (pseudo class & pseudo element) - CSS

    2019.05.02 by 쌩우

  • 시멘틱 마크업 - HTML

    2019.05.01 by 쌩우

  • Label, fieldset, legend, form - HTML

    2019.05.01 by 쌩우

fs 모듈 (동기와 비동기) - Nodejs

const fs = require('fs'); //파일 읽기 fs.readFile('./readme.txt', (err, data) => { if(err) { throw err; } console.log(data.toString()); }); //파일 쓰기(만들기) fs.writeFile('./writeme.txt', '내용을 써주세요', (err, data) => { if(err) { throw err; } fs.readFile('./writeme.txt', (err, data) => { if(err) { throw err; } console.log(data.toString()); }); }); 동기 비동기 fs method는 뒤에 Sync를 붙이면 동기식으로 작동한다. 주로 데스크탑 프로그램이나 딱 ..

Programming/Concept 2019. 5. 14. 16:28

util(deprecate, promisify) - Nodejs

deprecate 특정 함수에 대하여, 지원이 만료될 것으로 예상되는 것에 deprecate로 감싸주어 미리 표시를 해준다. const util = require('util'); const crypto = require('crypto'); const dontuseme = util.deprecate((x,y) => { console.log(x + y); }, '이 함수는 00부로 지원하지 않습니다.') dontuseme(1, 2); //node로 해당 코드 실행 시, 원하는 값 3은 얻을 수 있지만, Deprecation Warning이라는 주의와 함께 메시지가 표시된다. promisify promise를 지원하지 않는 (error, data) => {} 모양의 콜백은 util.promisify를 이용해 ..

Programming/Concept 2019. 5. 14. 16:04

crypto 모듈을 이용한 양방향 암호화 - Nodejs

const crypto = require('crypto'); const cipher = crypto.createCipher('aes-256-cbc', '열쇠'); let result = cipher.update('swoo바보', 'urf8', 'base64'); result += cipher.final('base64'); //'aes-256-cbc'알고리즘을 통해 암호화시킨다. //암호화시킨 값을 다시 복호화시키기 위해서는 '열쇠'라는 값을 알아야 가능하다. //암호화시킨 최종값을 cipher.final을 통해서 정의해준다. //다시 복호화시키는 방법 const decipher = crypto.createDecipher('aes-256-cbc', '열쇠'); let result2 = decipher.up..

Programming/Concept 2019. 5. 14. 15:24

crypto 모듈을 이용한 단방향 암호화(hash) - Nodejs

보통 Nodejs를 사용할 때 암호화가 필요한 경우는 password를 암호화하는 경우이다. const crypto = require('crypto'); crypto.createHash('sha512').update('비밀번호').digest('base64') //해당 '비밀번호'를 'sha512' 방식으로 암호화하여 'base62' 방식으로 표시하여라 //암호화한 비밀번호는 다시 복호화 할 수 없다. //데이터베이스에 저장된 비밀번호도 암호화된 해시값으로만 저장한다. //로그인 시에 입력한 값을 암호화시킨 값이 저장되어있던 값과 일치하는지를 확인하여 인증한다. 하지만 위와 같은 방식의 암호화는, 전혀 다른 값을 암호화 한 해시값이 일치해버리는 경우도 생길 수 있다. 이를 해시 충돌이라고 한다. 때문에 ..

Programming/Concept 2019. 5. 14. 15:01

RESTful API

REST : Respresentational State Transfer. REST is an architecture style for designing networked applications. 표면적인 실체는 '스타일' 또는 '패턴'이라고 할 수 있다. RESTFUL이라는 것은 REST 방식을 잘 따르도록 설계되었다는 의미이다. 웹을 근간으로 하는 HTTP protocol 기반이다 리소스는 URI(Uniform Resource Identifiers)로 표현하며 말 그대로 '고유'해야 한다 URL는 단순하고 직관적인 구조여야 한다 리소스의 상태는 HTTP Methods를 활용해서 구분 XML/JSON을 활용해서 데이터를 전송(주로 JSON) REST에서의 CRUD Create - POST Retrieve..

Programming/Concept 2019. 5. 6. 15:36

가상 선택자 (pseudo class & pseudo element) - CSS

가상 선택자란? : 지금 문서 내에 존재하지 않는 구조, 즉 문서에 존재하지 않는 요소에 스타일을 부여할 수도 있고 특정 요소의 상태를 미리 추정하여 가상의 클래스로 스타일을 적용시킬 수도 있는 선택자이다. 1) 가상 클래스 : 미리 정의해놓은 상황에 적용이 되도록 약속돼있는 보이지 않는 클래스. 예를 들어 특정한 상황(어떤 글자 위에 마우스 포인터를 놓은 상황)에 해당 컨텐츠의 색깔을 변화시키고 싶은 경우, 기존 방법이라면 javascript 같은 외부 언어를 통해서 함수를 지정해주어야 하는 번거로움이 있었을 것이다. 자식 요소 관련 태그이름:fisrt-child => 해당 태그의 첫 번째 자식 요소 선택 태그이름:last-child => 해당 태그의 마지막 자식 요소 선택 링크 관련 a:link =>..

Programming/Concept 2019. 5. 2. 15:44

시멘틱 마크업 - HTML

검색 엔진 최적화란 HTML코드에서 정보를 모아 검색 키워드에 맞는 적절한 웹사이트 구성하여, 검색결과의상위에나올 수있도록하는작업이다. 해당 웹페이지의 내용을 파악하고 검색엔진에 노출이 잘되도록 하기 위해서는HTML요소를 적절하게 사용한 시멘틱한 마크업이 필요하다. '시멘틱 마크업'이란? Semantic은 기계(컴퓨터, 브라우저)가 잘 이해할 수 있도록 하는 것을 뜻한다. 사람과 기계가 잘 소통할 수 있도록 적절한 HTML 요소를 적시에 사용하는 것에서부터 시작한다. 마크업 시에는 의미에 맞는 태그, 요소를 사용하고 문서를 표현할 때에는 구조화를 잘 해주는 것으로 브라우저에게 코드를 잘 이해시킬 수 있다. 아래는 그 예시이다. 굵은 vs 중요한 기울어진 vs 강조하는 밑줄친 vs 새롭게 추가된 중간선이 ..

Programming/Concept 2019. 5. 1. 16:36

Label, fieldset, legend, form - HTML

Label form 컨트롤과 연결 시켜주기 위함으로, 웹 접근성 향상에 도움이 된다 (필수요소!) form으로 보낼 요소의 태그에 지정한 id와 동일한 값을 label에 지정해준다. 아이디: //label로 감싼 '아이디' 글자 클릭시, 동일 id로 연결된 요소를 클릭한 것처럼 동작한다. Fieldset과 Legend form 요소들을 구조화하기 위해 필요한 태그들이다. fieldset 태그는 form 요소를 그룹화하고, legend 태그는 fieldset으로 묶인 그룹의 이름을 지정해주는 태그이다. 주의사항으로는, fieldset 태그의 첫번째 자식 요소는 항상 legend 태그여야만 한다. 기본 정보 아이디: 부가 정보 취미:

Programming/Concept 2019. 5. 1. 16:01

추가 정보

인기글

최신글

페이징

이전
1 2 3 4 5 6 7 8 ··· 10
다음
Phot_o_matic Programming © phot_o_matic
페이스북 트위터 인스타그램 유투브 메일

티스토리툴바