<다시 편집할 예정!>



이 문제 또한 너무 오래 전에 풀어서 지금 다시 보니까 새롭지만 복습 차원에서 한번 보겠다 ㅋㅎㅋㅎ

이건 근데 문제읽어보고 숫자를 쫘악 나열해보고 거기서 규칙만 찾으면 간단하게 구현할 수 있었던 문제였다.

그 규칙 찾는게 오래 걸리고 귀찮았던 것 같당

숫자 쫙 나열해보면서 에 설마 여기에 규칙이 있겠어 하면서 숫자 조금만 써보고 말아서 규칙 찾기까지가 은근히 걸렸당

앞으로는 귀찮아 하지 말자...!




1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
#include <stdio.h>
#include <math.h>
 
int main() {
    int x, y, z, ans;
    scanf("%d"&ans);
    for (int k = 0; k < ans; k++) {
        scanf("%d %d"&x, &y);
        z = y - x;
        int i = sqrt(z);
            if ((z >= i * i - i + 1&& (z <= i * i)) {
                printf("%d\n", i + (i - 1));
            }
            else if ((z >= i * i + 1&& (z <= i * i + i)) {
                printf("%d\n", i + i);
            }
            else
                printf("%d\n", (i + 1+ i);
    }
    return 0;
}
cs


D + 15

점점 의욕을 잃고 있다,,, 오늘 시간 너무 안 가서 지루해 죽는 줄 알았따 ㅋㅋㅋㅋㅋ
빨리 할 일을 찾아야지... 할 게 너무 많아서 의욕을 잃은 것 같기도 하고^^
그래서 오늘은 한 게 별로 없당,,, 정리를 열심히 안 한 탓도 있지만서도~ㅋㅎㅋㅎ
귀찮아서 대ㅜ충함



  1. json파일 분리해서 사용하는 방법 찾아보기

  2. json파일에서 배열로 사용하는 방법 찾아보기

  3. node.js 책 공부하기



<json 파일 사용>

1

2

3

{

   "dog":["진돗개", "리트리버", "푸들"]

}

cs

dog[0] = “진돗개”


1

2

3

4

5

6

7

8

9

10

11

12

{

   "dog":

   [

       "진돗개",

       "리트리버",

       "푸들",

       {

           "owner":"홍길동",

           "phone":"0101234"

       }

   ]

}

cs

dog[3].owner = “홍길동”


<t 함수>

translate.json

1

2

3

4

5

6

{

   "error":{

       "unspecific":"somthing went wrong",

       "404":"The page was not found"

       }

}

cs


sample

1

2

3

4

5

const error = '404';

i18next.t([`error.${error}`,'error.404'])

const error = '502';

i18next.t([`error.${error}`,'error.unspecific'])

cs


첫 번째 코드는 ‘The page was not found’가,

두 번째 코드는 ‘something went wrong’이 출력된다.


<JSON.stringify(value, replacer, space)>

자바스크립트의 값을 JSON 자열로 변환하는 것

* value : json문자열로 변환할 값이다. 배열, 객체, 숫자 문자 등이 될 수 있다.

* replacer : 함수 또는 배열이 될 수 있다. 이 값이 null이거나 제공되지 않으면 객체의 모든 속성들이 json 문자열 결과에 포함된다.


(node.js 공부)

<세션 관리하기>

  1. 특징 :  서버쪽에 정보가 저장된다.

  2. 사용 : 로그인하면 세션이 생성되고, 로그아웃하면 세션이 삭제되어 사용자가 로그인하지 않았을 때에는 접근이 제한된 페이지를 볼 수 없다.

  3. user세션 확인 후

    1. 세션 객체가 존재하면 요청페이지를 띄운다.

    2. 세션 객체가 존재하지 않으면 로그인 화면으로 넘어가고, 로그인 후에는 요청 페이지를 볼 수 있다.


1

2

3

4

5

6

app.use(cookieParser());

app.use(expressSession({

   secret:'my key',

   resave:true,

   saveUninitialized:true

});

cs

세션을 설정하는 코드이다. cookie-parser와 express-session모듈을 따로 설치해 주어야 한다.


1

2

3

4

5

6

7

8

9

router.route('/process/product').get(function(req,res){

   if(req.session.user){

       res.redirect('/public/product.html');

   } else {

       res.redirect('public/login.html');

   }

});


app.use(‘/’, router);

cs

이 코드에서 req.session.user는 세션 객체를 말한다. 즉, if(req.session.user)은 세션 객체가 존재하면, product페이지(접근 제한 된 페이지)로, 세션 객체가 존재하지 않으면 로그인 페이지로 이동한다.


<파일 업로드 기능 만들기>

파일 업로드 기능을 추가하려면 multer미들웨어를 설치해야 한다.


1

2

3

4

5

6

7

8

var storage = multer.diskStorage({

   destination: function (req, file, callback) {

       callback(null, 'uploads')

   },

   filename: function (req, file, callback) {

       callback(null, file.originalname + Date.now())

   }

});r

cs

destination은 업로드 파일을 저장할 폴더명을 지정해주고, filename은 파일 명을 변경할 수 있게 한다.

1

2

3

4

5

6

7

var upload = multer({

   storage: storage,

   limits: {

       files: 10,

       fileSize: 1024 * 1024 * 1024

   }

});

cs

limits는 파일 갯수와 크기를 제한한다.


MIME TYPE : multipurpose Internet Mail Extense로, 파일 변환을 의미한다. 파일 전달에 사용된다.



<오류>

ejs파일에서 __(‘ ‘)없애면 그 변수에 저장된 값이 나오는 것이 아니라 문자 그대로 출력된다.

문제 해결하기




ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ


<다음주 월요일에 할 일>


  1. 페이지가 여러 개일 때/버튼을 클릭했을 때 새로운 화면이 나올 경우 하나의 언어인 상태로 계속 유지 되는지 구현해 보기

  2. node.js  로그인/회원가입 - DB구축 공부하기(월,화까지)

  3. i18n과 i18next차이점

  4. 마지막 오류 해결하기


'동계현장실습' 카테고리의 다른 글

19.01.29 화요일  (0) 2019.01.30
19.01.28 월요일  (0) 2019.01.28
19.01.24 목요일  (0) 2019.01.24
19.01.23 수요일  (0) 2019.01.23
19.01.22 화요일  (0) 2019.01.22

D + 14



갑자기 할 게(?)사라져서 의욕을 잃은지 3일째다 ㅋㅋㅌㅋㅌ

그래서 몰래 DB공부를 할 생각이닷ㅋㅋ

do it 노드제이에스 책으로 조금씩 공부해야겠다.



  1. node.js에서 URL관련 모듈에 대해 공부하기(특히 파서 / 노드 공부)

  • url.parse

  • url.format

  • url.resolve

  1. node에서 ejs파일로 변수나 데이터 가져오는 방법 찾아보기

  2. json파일을 여러 개로 분류해서 저장해서 사용하는 방법 알아보기




> 현재까지 구현한 내용

처음 페이지는 localhost:3000에서 디폴트 언어는 영어이므로 영어화면을 띄우고, 을 누르면 한글 버전으로 변경되며 path는 /ko로 바뀐다. 을 누르면 영어 버전으로 바뀌며 path는 /en으로 바뀐다.


> 추가로 구현할 내용

한글 버전일때와 영어 버전일때와 화면 구성을 다르게 한다. 그래서 화면에서의 메뉴 한 부분을 영어 버전일때에는 아예 사라지도록 구현해 보기로 했다.

메인 js파일에서 현재의 path가 ko일 때와 en일 때와 분류하여 새로운 변수(nword)에 저장한 후 ejs파일에서 변수가 ko일 때에는 메뉴가 나오도록, en일 때에는 메뉴가 없어지도록 코드를 추가해 주면 될 것이라고 생각하였다.

1

2

3

app.get('/:lang',function(req,res){

   var nwrod = req.params.lang;   

}


<메인 js>

1

2

3

4

5

<% if(nword === 'ko') {%>

HTML코드...

<% } %>


<ejs 파일>

하지만 위와 같은 메인 js에서 정의한 변수는 ejs로 가져갈 수 없다. 메인 js에서 정의한 변수를 ejs에서 사용하기 위해서는 render 함수를 통해 렌더링을 해 주어야 ejs에서 사용할 수 있다. nword 변수에 현재 path를 렌더링 한다. req.params.lang는 현재 url의 path를 말한다.

1

2

3

4

app.get('/:lang',function(req,res){

   res.render('page', {nword : req.params.lang});

   res.end();

});


<메인 js>

위 코드처럼 해 주면 nword(path)가 ko일 때에는 HTML코드 부분이 나오게 되고 그렇지 않을 경우(en)에는 그 코드 부분은 나타나지 않게 된다.


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

var theBandEn = fs.readFileSync('./views/theBand_en.ejs', 'utf8');

var theBandKo = fs.readFileSync('./views/theBand_ko.ejs','utf8');

app.get('/:lang',function(req,res){

   var pth = req.params.lang;   

   if(pth === 'ko'){

       res.cookie('lang','ko',{path:'/ko'});

       res.render('page', {nword:pth, theBand : theBandKo});

   }

   else {

       res.cookie('lang','en',{path:'/en'});

       res.render('page',{nword:pth, theBand:theBandEn});

   }

   res.end();

})

app.get('/',function(req,res){

   res.cookie('lang','en',{path:'/'});

   res.render('page',{nword:"en",theBand:theBandEn});

   res.end();

})


<전체적인 메인 js>

<ejs파일 일부분 - theBand부분과 ko부분에서만 띄워 줄 부분>


* node.js에서 ejs뷰 템플릿으로 변수를 가져오려면 render를 통해 가져오면 된다. <% %> 안에는 자바스크립트 코드를 사용할 수 있다.


<결과>

영어 페이지에는 아래 사진들이 나오지 않았고, 한글 페이지에는 사진들이 나왔다.





> i18n을 구현할 때 en.json파일을 여러개로 나누어서 저장할 수 있는지

성능면에서는 로드 속도가 조금 더 빨라지지만 이 속도는 무시할 수 있을 정도이다. 단일 파일을 사용하는 것이 가장 좋다. 다국어 처리 웹페이지를 구현할때 json파일을 여러개로 나누어서 저장하려면 i18next를 사용해야 하는 것 같다. 하지만 express서버에서 i18next를 사용하는 사례(?)는 거의 없는 것 같다. 주로 노드는 i18n으로 구현하는 것 같다.

i18next를 이용하면

로케일 파일의 구조가 이 화면과 같을 때,

i18next 로듈을 이와 같이 저장할 수 있다. 하지만 node.js와 구현하는 방법은 아직 정확하게 찾지 못하였다.



<<1월 25일 금요일>>

내일은 몽고디비부분까지 공부할 예정이다.

json파일 분리해서 사용하는 방법에 대해서도 찾아봐야겠다.



'동계현장실습' 카테고리의 다른 글

19.01.28 월요일  (0) 2019.01.28
19.01.25 금요일  (0) 2019.01.25
19.01.23 수요일  (0) 2019.01.23
19.01.22 화요일  (0) 2019.01.22
19.01.17 목요일  (1) 2019.01.18

D +13


오늘은 왜이렇게 내용이 없는건가,,,ㅇ??ㅋㅋㅋㅋ


  1. 영어 페이지와 한글페이지를 다르게 구현(?)

    1. 현재 URL받아오는 법 찾기

    2. url구조?공부하기

  2. json파일을 배열로 저장하고 사용하는 법 찾아보기



1. 현재 URL을 받아오기

URL이란 - 인터넷 상의 자원의 위치를 말한다.


예시 URL : http://www.google.co.kr/docs/index.html

접근 프로토콜://ip주소 또는 도메인 이름/문서의 경로/문서이름


* js에서 URL(현재 호스트 정보)얻기

 location.protocol = http:

 location.host = google.co.kr

 location.pathname = test/sample

 location.search = ?id=123&name=test



* URL모듈 종류

  • url.parse : URL정보를 객체로 가져와서 분석한다.

  • url.format : URL 객체를 문자열로 바꾸어준다.

  • url.resolve : URL객체를 문자열로 바꾸어준다.



app.get(‘/:lang’, function(req,res,next){

if(req.params.lang === ‘ko’)

var nword = ‘ko’;

next();

});

코드의 의미 : 페이지의 path(경로) lang이 ko 일때 nword 변수에 ko문자열을 저장하여라

이 코드를 활용해서 변수에 값을 저장하고 이 변수를 ejs에서 활용할 수 있도록 하는 방법을 찾아야 할 것 같다.



2. json 파일을 여러 파일로 나누어서 저장이 가능한지


성능면에서는 로드 속도가 조금 더 빨라지지만 이 속도는 무시할 수 있을 정도이다. 단일 파일을 사용하는 것이 가장 좋다.


파일을 여러 개 사용하려면 json파일은 아래와 같이 저장한다.

locales/en/nav.json

locales/en/words.json

locales/en/phrases.json


instance.setup({

backend: {

loadPath: ‘/locales/{{lang}}/{{en}}.json’

},

lang : ‘en’,

ns : [‘nav’, ‘words’, ‘phrases’],

defaultNS : ‘words’,

attributes : [‘t’, ‘i18n’],

fallback : ‘ko’,

debug : false

});




ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ


<0124 목요일>


  1. node.js에서 URL관련 모듈에 대해 공부하기(특히 파서 / 노드 공부)

  • url.parse

  • url.format

  • url.resolve

  1. node에서 ejs파일로 변수나 데이터 가져오는 방법 찾아보기

  2. json파일을 여러 개로 분류해서 저장해서 사용하는 방법 알아보기


'동계현장실습' 카테고리의 다른 글

19.01.25 금요일  (0) 2019.01.25
19.01.24 목요일  (0) 2019.01.24
19.01.22 화요일  (0) 2019.01.22
19.01.17 목요일  (1) 2019.01.18
19.01.15 화요일  (0) 2019.01.15

D+12


i18n구현.pptx


어제 오늘 발표준비 하느라 정리한 내용도 없고 그래서 어제 글을 올리지 못 했다.

지금까지 조사하고, 공부하고 구현한 내용을 오늘 발표했다.

(,,,별 내용도 아닌데 괜히 엄청 떨렸듬,,, )



ppt내용의 일부분만 캡쳐해보았다 ㅋㅎㅋㅎ

i18n을 구현할 때의 전반적인 구조와 공부한 내용을 바탕으로 구현을 두 가지 방식으로(?) 해 본 내용을 정리하여 발표했다.


내일은 회의(?)하면서 구현해 달라고 부탁받은 것과 ejs템플릿의 태그, node js에서 현재 URL을 받아오는 법에 대해 찾아보고 공부해야 할 것이다!


내일부터 다시 열심히 해야즤,,,



'동계현장실습' 카테고리의 다른 글

19.01.24 목요일  (0) 2019.01.24
19.01.23 수요일  (0) 2019.01.23
19.01.17 목요일  (1) 2019.01.18
19.01.15 화요일  (0) 2019.01.15
19.01.14 월요일  (0) 2019.01.14
D+9


어제는 하루종일 코드 고치기만 해서 한 게 없다.


  1. 어제 해결한 문제 정리(cookie)

  2. json 포맷 형식(?) 공부

  • 어디에 사용하는지

  • 문법/형식 알기

  1. 어제까지 구현한 내용에서 보충해서 바꾸기

  • 현재 : 첫 화면(html)인 ‘안녕’의 글자를 ko버튼을 누르면 안녕하세요, en버튼을 누르면 hello로 변경

  • 바꿀 내용 : 첫 화면(ejs)부터 디폴트언어로 화면에 보여준 후 ko버튼과 en버튼으로 변경. 즉, ‘안녕’의 화면을 없애기(html 없애기)

 

1. 어제 해결한 문제 정리(cookie)

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

var express = require('express')

var http = require('http');

var path = require('path');

var ejs = require('ejs');

var i18n = require('./i18n');

var cookieParser = require('cookie-parser');

var bodyParser = require('body-parser');

var static = require('serve-static');

var app = express();

app.set('port', process.env.PORT || 3000);

app.use(bodyParser.urlencoded({ extended: false }));

app.use(bodyParser.json());

app.use(cookieParser());

app.set('view engine','ejs');

app.use('/views', static(path.join(__dirname, 'views')));

app.use(i18n);

app.get('/en',function(req,res,next){

  res.cookie('lang','en',{path:'/en'});

   res.render('index.ejs');

   next();

});

app.get('/ko', function(req,res,next){

  res.cookie('lang','ko',{path:'/ko'});

   res.render('index.ejs');

   next();

});

http.createServer(app).listen(app.get('port'), function(){

 console.log('Express server listening on port ' + app.get('port'));

});



쿠키를 생성할 때 path를 지정해 줌으로써 3일만에 문제 해결~!~!~!


결국엔 사이트에 질문 올려서 답변을 받아서 해결했다 ㅎ

두 번씩 눌러야 반영 되었던 이유는 res.cookie('lang', ...)은 렌더링이 완료되고 난 후에 설정하는 것이라 요청시의 쿠키값이 렌더링할 때 반영되어서 그렇다.

이를 해결 하기 위해서는 폼(form)을 submit 하기 전에 가로 채서 클라이언트 쪽에서 쿠키를 해당 언어로 새로 쿠키를 지정해 주거나, 위의 방법처럼 쿠키를 업데이트 할 때 path를 지정해 준다.


2. JSON 포맷 형식 공부

<Ajax란>

  1. Asynchronous JavaScript and XML의 약자이다.

  2. Ajax는 빠르게 동작하는 동적인 웹 페이지를 만들기 위한 개발 기법의 하나이다.

  3. Ajax는 웹 페이지 전체를 다시 로딩하지 않고도, 웹 페이지의 일부분만을 갱신할 수 있습니다. 그렇기 때문에 웹페이지가 로드된 후에 서버로 데이터 요청을 보낼 수 있다.

 

<JSON이란>

  1. JavaScript Object Notation의 약자이다.

  2. 데이터를 보여주는 목적이 아닌 저장하고 전달할 목적으로 만들어진 텍스트 기반의 데이터 교환 표준이다.

  3. 기계와 사람이 쉽게 읽을 수 있다.

  4. 경량의 DATA 교환방식을 말한다.


<JSON 문법&구조>

  1. 리터럴/객체

  2. 주석은 사용하지 않는 것이 좋다.

  3. 데이터는 이름과 값의 쌍으로 이루어지며 콤마(,)로 나열된다. “이름” : “값”, “이름” : ”값”

  4. 객체는 {}로 표현하고, 배열은 []로 표현한다.

  5. 이스케이프 시퀀스

     escape 

     의미 

     \b 

     백스페이스 

     \f 

     폼 피드(form feed) 

     \n 

     개행 

     \r

     캐리지 리턴 

     \"

     큰 따옴표

     \/

     슬래시

     \\

     역슬래시

     \t

     탭

     \uHHHH

     16진수 유니코드 문자


  1. 객체 안에 객체를 포함시켜 계층구조 표현도 가능하다.

  1. 객체는 프로퍼티의 집합, 배열은 데이터 값의 집합이라는 차이가 있다.


<JSON스키마>

  1. JSON데이터 형식을 기술한 문서를 JSON스키마라고 한다.

  2. 대표적인 검증 키워드

    검증 키워드 

    설명 

    type 

    유효한 데이터의 타입을 명시함 

    properties 

    유효한 데이터 이름과 값의 쌍들을 명시함 

    required 

    명시한 배열의 모든 요소를 프로퍼티로 가지고 있어야만 유효함 

    minimum 

    최솟값 이상의 숫자만 유효함 

    maximum 

    최댓값 이하의 숫자만 유효함 

    multipleOf 

    명시한 숫자의 배수만 유효함 

    maxLength 

    명시한 최대 길이 이하의 문자열만 유효함 

    minLength 

    명시한 최소 길이 이상의 문자열만 유효함 

    pattern 

    명시한 정규 표현식에 해당하는 문자열만 유효함 



<예시>


  1. JSON.stringify() 메소드는 인수로 전달받은 자바스크립트 객체를 문자열로 변환하여 반환한다.


<출처 : http://tcpschool.com/json/intro>


3. 구현한 코드 보충

  • index2.http파일을 삭제하고, 아래 코드를 추가함

1

2

3

4

5

6

7

8


app.use(express.static(path.join(__dirname, 'views')));

app.get('/',function(req,res){

   res.render('index.ejs');

   res.end();

});



4. 간단하게 만들어 본 웹페이지

웹페이지의 맨 아래 버튼을 누르면 영어, 한국어로 바뀌도록 구현





[문제점]

  1. 사진이 첨부되지 않음

  • 해결 : app.js파일에서 하위 라우터 경로를 잘못 설정함.

  1. 웹페이지의 본문 부분은 자주 바뀔수 있기 때문에 따로 ejs파일로 빼 주어서 웹페이지를 구현하였는데 이를 json에서 파싱(?)하는 법을 모르겠다.



<부트 스트랩 테마를 사용했습니당 www.w3schools.com>


ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ


<<01.18 금요일 할일>>


  1. 오늘의 문제점 해결할 것

  2. 직접 만들어볼 웹페이지 구상하기

  3. json 파일 사용법에 대해 좀 더 익히기


'동계현장실습' 카테고리의 다른 글

19.01.23 수요일  (0) 2019.01.23
19.01.22 화요일  (0) 2019.01.22
19.01.15 화요일  (0) 2019.01.15
19.01.14 월요일  (0) 2019.01.14
19.01.11 금요일  (0) 2019.01.11

+ Recent posts