개발 가이드 초기 설정 작성

Shavakan commented 7 years ago

매번 할 때마다 간격이 길다보니 어떤 작업들을 해줘야 하는지 자꾸 까먹네요...

SPARCS SSO 특성 상 개발자마다 환경 설정 등을 해줘야 하는 부분들이 있는데 간단하게 보면서 따라할 수 있는 문서를 만들어 두는게 나을 것 같습니다.

지금 존재하는 README.md를 고치는게 적절할 것 같습니다.

Shavakan commented 7 years ago

Introduction

By default, [WEB_PORT] and [API_PORT] are set as 8080 and 8000 by the frameworks. You may change these settings, but you must also make the required changes (e.g. in SPARCS SSO Test Service), if you choose to do so.

You need to setup SPARCS SSO configurations for development.
You need to run both the API Server (Django) and Web (Vue.js) in development configurations.
NEVER commit these changes to remote repository!!!

SPARCS SSO

Add a SPARCS SSO Test Service

Main URL: http://localhost:[WEB_PORT]
Login Callback URL: http://localhost:[WEB_PORT]/auth/login_callback
Unregister URL: http://localhost:[WEB_PORT]/api/users/unregister (NOT implemented yet)

Web (Vue.js)

config/index.js:

module.exports = {
  ...
  dev: {
    ...
    port: [WEB_PORT],
    ...
    proxyTable: {
      "/api": {
        target: "http://localhost:[API_PORT]/api",
        ...
      }
    }
  }
}

config/dev.env.js

module.export = merge(prodEnv, {
  NODE_ENV: '"development"',
  SSO_CLIENT_ID: '""',            // Enter Client Id for your SPARCS SSO test service
  SPARCS09_API_DOMAIN: '"http://127.0.0.1:[WEB_PORT]/api/"',
}

Install NPM Dependencies

$ npm install

Run Vue.js

$ npm run dev
node build/dev-server.js

[HPM] Proxy created: /api  ->  http://localhost:16134/api
[HPM] Proxy rewrite rule created: "^/api" ~> ""
> Starting dev server...

| DONE | Compiled successfully in 7662 ms                                               15:29:06

> Listening at http://localhost:[WEB_PORT]

On Windows, you may encounter this error: Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style

In this case, just turn off linebreak-style option from eslint for simplicity.

module.export = {
  ...
  'rules': {
    "linebreak-style": 0,
    ...
  }
}

API (Django)

settings.py:

SSO_ID =                    # Enter Client Id for your SPARCS SSO test service
SSO_KEY =                   # Enter Secret Key for your SPARCS SSO test service

ALLOWED_HOSTS = [
    '127.0.0.1',
    'localhost',
]

Create Virtual Python Environment

Download virtualenvwrapper

$ mkvirtualenv -p python3 sparcs09
$ workon sparcs09

Check your local machine's python version if mkvirtualenv -p option fails. For instance,

$ which python3
/usr/bin/python3

Install Python Dependencies (if haven't done so)

(sparcs09) $ pip install -r requirements.txt

API Database Migrate

(sparcs09) $ python manage.py makemigrations
(sparcs09) $ python manage.py migrate

Run API Server

(sparcs09) $ python manage.py runserver 0.0.0.0:[API_PORT]
Performing system checks...

System check identified no issues (0 silenced).
July 18, 2017 - 15:20:28
Django version 1.11.2, using settings 'sparcs09.settings'
Starting development server at http://0.0.0.0:[API_PORT]/
Quit the server with CTRL-BREAK.

Shavakan commented 7 years ago

@sugoiii 한 번 따라해보시고 PR #38 리뷰해보세요. 하다가 문제가 있으면 알려주세용

sugoiii commented 7 years ago

정말 사소한 것들이지만

config/dev.env.js 부분에 [가 오타로 있는것 같아요!
npm run dev 전에 npm install이 있으면 조금 더 친절해질 것 같아요..

그나저나 안되네요ㅠㅠㅠ 로그인을 누르면 콜백은 되는것 같은데 로그인버튼이 바뀌지가 않아요... 콘솔에서도 별 에러를 뿜지는 않는데...

Shavakan commented 7 years ago

수정했습니당. 어느 부분에서 안되고 있어요?

Shavakan commented 7 years ago

개발자 도구를 열어보고 어떤 에러가 나고 있는지 알려줄래요?

sugoiii commented 7 years ago

XMLHttpRequest cannot load http://127.0.0.1:12345/api/sessions/. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:12345' is therefore not allowed access.

이라고 합니다!

Shavakan commented 7 years ago

API DOMAIN이 WEB PORT로 설정되어 있는지 확인해볼래요?

sugoiii commented 7 years ago

넵 맞게 되어 있어요!

ktk1012 commented 7 years ago

12345가 혹시 api 서버 포트인가요? 현재 API_DOMAIN에서 port 설정은 front-end 서버 설정을 따라갑니다.. 그러니까.. API_DOMAIN이 localhost:8080/api 로 되어있어야 합니다. (8080이 npm run dev실행 했을 때의 port number)

Shavakan commented 7 years ago

@sugoiii 커밋한 브랜치에 본인 설정이 어떻게 되어있는지가 빠져있어서 문제 파악이 어렵습니다 ㅋㅋㅋㅋ 설정한 내용도 같이 커밋해주세요

samjo-nyang commented 7 years ago

그냥 기본값 넣어놓고 process.env.XXX로 환경변수에서 가져오도록 바꾸면 좋을거 같아여

sparcs-kaist / sparcs09