React

맥에서 입맛에 맞는 에디터 찾기가 쉽지 않습니다. 특히나 맥맹인 저로써는 Visual Studio for Mac도 그리 좋아하지 않습니다. 애초에 텍스트 에디터나 리치 에디터 쪽에는 애플이 별로 신경을 쓰지 않은 것으로 보이네요. 적어도 맥맹인 저에게는 그렇습니다. =_=;;

그나마 마음에 드는 녀석이 바로 WebStorm 이네요. 코딩의 즐거움을 줄이기? 위해서 ReactJS용 템플릿을 만들어 보았습니다. 만든 김에 귀찮아서 package.json, webpack.config.js 템플릿도 만들었습니다. 지우고 다시 설정하면 되도록 계속 조정을 할 생각입니다. ^^

Preferences > Editor > File and Code Templates > + (add)

1. React File (js)

import React, { Component, PropTypes } from 'react';


export default class ${NAME} extends Component {

  static propTypes = {


  };

  

  constructor(props) {

   super(props);

   this.state = {

    

   };

  }

  

  componentWillMount() {


  }


  componentDidMount() {


  }


  componentWillReceiveProps() {


  }


  componentWillUpdate() {


  }


  componentDidUpdate() {


  }


  componentWillUnmount() {


  }

  

  render() {

    return (

        <div>

        </div>

    );

  }

}


2. React Package File (json)

{

  "name": "kanbanboard",

  "version": "0.1.0",

  "private": true,

  "dependencies": {

    "history": "^4.6.3",

    "react": "^15.6.1",

    "react-dom": "^15.6.1",

    "react-router": "^4.1.1"

  },

  "devDependencies": {

    "babel-core": "^6.25.0",

    "babel-loader": "^7.1.0",

    "babel-preset-es2015": "^6.24.1",

    "babel-preset-react": "^6.24.1",

    "react-hot-loader": "^1.3.1",

    "react-scripts": "1.0.7",

    "webpack": "^3.0.0",

    "webpack-dev-server": "^2.5.0"

  },

  "scripts": {

    "start": "react-scripts start",

    "build": "react-scripts build",

    "test": "react-scripts test --env=jsdom",

    "eject": "react-scripts eject",

    "dev": "webpack-dev-server --progress --hot"

  }

}


3. React Webpack File (js)

var webpack = require('webpack');


module.exports = {

  entry: './src/index.js',


  output: {

    path: __dirname + '/public/',

    filename: 'bundle.js'

  },


  devServer: {

    hot: true, // 파일이 수정할때마다 리로드

    inline: true,

    port: 7777,

    contentBase: __dirname + '/public/'

  },


  module: {

    loaders: [

      {

        test: /\.js$/,

        loaders: ['react-hot-loader', 'babel-loader?' + JSON.stringify({

          cacheDirectory: true,

          presets: ['es2015', 'react']

        })],

        exclude: /node_modules/

      }

    ]

  },


  plugins: [

    new webpack.HotModuleReplacementPlugin()

  ]

};


신고

WRITTEN BY
비트센스
뷰파인더로 보는 프로그래머의 세상 페이스북 @bitsense 트위터 @picory 스카이프 picory MSN drawhalf@dreamwiz.com

받은 트랙백이 없고 , 댓글이 없습니다.
secret
VISUAL STUDIO

혹시나 했는데, 진짜 일까 했는데...

Visual Studio가 맥용으로 나왔네요. 설마... MS가 윈도우를 포기한 것은 아니겠죠??? ^^

그래도 한글은 그지 같은 이느낌..은 기우여야 할 건데~~

좋은 밤 되십시오.

신고

WRITTEN BY
비트센스
뷰파인더로 보는 프로그래머의 세상 페이스북 @bitsense 트위터 @picory 스카이프 picory MSN drawhalf@dreamwiz.com

트랙백이 하나이고 , 댓글 하나 달렸습니다.
  1. 비밀댓글입니다
secret