• How it actually feels to write JavaScript in 2016

  • 2016년에 자바스크립트를 실제로 배우는 기—분

  • Hey, I need to create a page that displays the latest activity from the users, so I just need to get the data from the REST endpoint and display it in some sort of filterable table, and update it if anything changes in the server. I was thinking maybe using jQuery to fetch and display the data?
  • 야, 내가 지금 사용자들이 남긴 최근 행동들을 보여주는 페이지를 짜야 하는데, 그러면 일단 REST를 이용해서 데이터를 긁어온 다음에 정렬이나 필터가 되는 테이블에 표시해 준 다음에 갱신되는 내용들은 서버에 넣으려고 해. 데이터 불러오고 표시하는 데 jQuery 쓰면 되지?
  • -Sure, you could still use jQuery. But if you’re ever planning to do something more complicated on the frontend you should probably try React. It will be a big benefit for you in the future.
  • - 응, 그냥 jQuery 써도 됨. 근데 더 복잡한걸 하려고 계획중이라면 아마 React를 써보게 될꺼야. 그래야 미래의 내가 과거의 나에게 감사할 수 있을껄.
  • -Sounds great. How can i start with React?
  • 오 그럼 React는 어떻게 시작해야 하는데?
  • -The easiest way is to run npm install create-react-app -g in your terminal and you can start with a project right away.
  • - 간단해. npm install create-react-app -g 를 터미널에서 입력하면 바로 시작할 수 있지.
  • -Cool, so you’re telling me that I don’t need any additional setup?
  • 킹왕장... 그럼 뭐 추가로 할 껀 없고?
  • -Nope.
  • - 없징
  • -Do I need to install any special IDE like Visual Studio, Android Studio, or XCode?
  • 그 왜 Visual Studio, Android Studio나 XCode 같은 통합 환경을 설치할 필욘 없어?
  • -Nope, just create your app with create-react-app my-cool-app and you’re good to go.
  • - 당근이지. 그냥 create-react-app my-cool-app 하고 나면 그냥 하면 됨.
  • -But what about extra dependencies? Do I maybe need to install Java on my machine? Maybe I also need Maven, Gradle, CocoaPods, or maybe I need to download some extra 20gb SDK?
  • 그래도 뭐 의존성 같은거 있지 않나? 자바를 설치해야 한다거나 아니면 Maven, Gradle, CocoaPods 같은 거나 20GB 넘는 SDK 를 설치하는게 보통 아닌가?
  • -Nope, just cd into your app and start it with npm start. That’s it.
  • - 전혀. 그냥 그렇게 만든 니 앱에 들어가서 npm start 하면 끝남.
  • -But do I have to build my app and wait for a long rebuild every time i change something?
  • 내가 뭔가 바꾼 다음에 내 앱을 리빌드할 때 까지 죽치고 기다려야 한다던가 그런 일은 없고?
  • -Nope. If you do a change the page will automatically refresh for you. If you change some CSS it will be live-reloaded for you, without doing a full page refresh.
  • - 그럴리가. 뭘 바꾸면 바로 새로고침 해줄꺼야. CSS 를 바꾸면 전체 페이지를 새로 고침하는 대신에 라이브 리로드 해줄꺼고.
  • -Sounds very useful! I think it can speed up my development process a bit. But wait, what do i do if i ever want to deploy a production version of my website? Because no one is *actually* deploying an unminified version of index.html, app.css, and main.js in production anymore, right?
  • 헐 쩐다... 더 빨리 개발하는데 도움이 되겠넹. 근데 프로덕션 웹 사이트에 배포 하려면 어때? 요새는 minify 하지 않은 index.html 이나 app.css, main.css 같은걸 프로덕션에 배포하진 않잖아?
  • -Yup, you’re right. If you ever want to deploy a production version of your site just run npm run build and everything that you need will be in your/build folder. Minified, optimised, and ready for deployment.
  • - 어 맞어. 프로덕션에 너가 만든 사이트를 배포하려면 npm build 하면 build 폴더 안에 너가 원하는게 다 들어가 있을꺼야. 최소화는 물론이고 최적화되어 있고 바로 배포하면 끝임.
  • -Thanks dude, that was very helpful.
  • 올ㅋ 인생에 도움이 되네.
  • *curtain falls down, applause and cheers from the audience, our 2 developers take a bow, shake hands, and ride off on dragons into the sunset*
  • * 막이 내려오고, 관중들의 박수와 환호소리와 함께 두 개발자는 인사를 하며 악수를 한 다음 용을 타고 석양으로 사라졌다 *
  • Let’s have fun and spread a bit more positivity and happiness in the JS community. If you want to know how to add a simple configuration to create-react-app without ejecting it read my latest post.
  • JS 커뮤니티에 긍정과 행복, 그리고 재미를 좀 퍼트려보쟈. create-react-app 으로 간단하게 설정을 추가하는 방법에 대해서 알고 싶으면 내 이전 포스트를 읽어보면 됨.
  • Check out kitze.io for more Javascript fatigue-fatigue.
  • Check out kitze.io for more Javascript fatigue-fatigue.
0 Comments