아로마의 개발 스토리

부모 컨테이너 - 자식 노드의 관계 부모 컨테이너: 자식 노드의 배치 방법 정의. row, column 등의 방향 자식 노드: 자식 노드가 차지하는 영역의 크기 정의. flex나 px 등 참고한 사이트 React Native를 사용한 초간단 커뮤니티 앱 제작 React Native를 사용한 간단한 앱 제작 방법을 설명합니다. www.slideshare.net

안드로이드 스튜디오와 같은 IDE 없이 터미널에서 명령어 만으로 애뮬레이터 실행이 가능하다. 뭔가 신기.. 아 물론 react할 때도 IDE 내에서 터미널 실행해서 켜긴 했지만, 그래도 이건 뭔가 신기해.. // 프로젝트 위치로 이동 후 npm run android

역시 개발에서 환경 구축이 제일 일이다.. 그래서 Expo 같은 게 다 나오는구나 싶다. 이런 의미로는 진짜 좋을 툴이네, 인정. 특히 비전공자들에게는 얼마나 힘든 일일까.. 결론적으로 위와 같은 화면을 보게 되었다. 해결방법이 인터넷에 제각각, 혹은 자세하게 나와있지 않아서 헷갈렸는데, (나도 가끔 나만 알 수 있게 올림.. 반성 ㅠㅠ) 자세하게 적어보고자 한다. 1. 윈도우 검색 창에서 '환경 변수 편집'을 검색해서 창을 띄운다. 2. 시스템 속성 창 - 고급 탭 - 환경 변수(N)... 버튼 클릭 3. 환경 변수 창에서 '사용자 변수' 아래 있는 '새로 만들기' 버튼 클릭: 나는 여기서 가장 많이 헷갈렸다. 시스템 변수 아래에도 새로 만들기 버튼이 있는데, 어디서 새로만들기를 해야 하는지 제대로 안..

Finally, 내가 선택한 것은 바로, React Native이다. (대세가 답이다..) 이유는, 대세인만큼 검색하면 많이 나오겠지 하는 마음이 제일 컸던 것 같다. 그리고 개발 방법은 Expo를 사용하지 않고, react native cli를 사용하는 방법을 선택했다. 이유는, 개발 자유도가 떨어지면 결국엔 다 갈아엎는 상황이 올 수도 있기 때문이다. 이런 경험을 예전에 해봤었지.. 안 좋은 기억.. 오늘 한 것은, 1) Chocolatey 설치: 엄청 간단. 엄청 빠름(약 1분?) 2) Nodejs, Python2, JDK 설치: 방법은 엄청 간단. 시간은 꽤 걸림(약 10분?) 3) 안드로이드 스튜디오 설치: 그냥 일반적인 윈도우 프로그램 설치 프로세스. 시간은 꽤 걸림(약 10분?) 4) Rea..

- React Native vs. Flutter 비교글: 각 OS에서 다르게 보이는 점과 자잘한 버그 때문에 결국 통합 개발식이 아닌 것처럼 느껴진다는 리액트 네이티브와는 달리, 직접 화면에 그리는 방식을 사용해서 OS와 상관 없이 개발이 '진짜 통합식'이라는 플러터. 현재 크로스플랫폼 개발자로서, OS별 빌드와 릴리즈를 위해 뭔가 있어야 된다는 건 동의하는데, 그게 어느 정도인지 감이 안 와서 겁나는 것 같다. 플러터가 더 좋아보임... 그렇지만 생긴지 1년 밖에 안 되었고 아직 자료가 많지 않다는 게 걸린다. [REACT NATIVE VS FLUTTER] 크로스플랫폼 앱 개발, 어떤 프레임워크를 사용해야 하나? 안녕하세요 소프트웨어 엔지니어 최지호입니다. 오늘은 앱 크로스 플랫폼에서 현재 가장 많이 ..

[configuration의 이해] port를 open한 후 설정하는 방법은 두 가지가 있다. 1. 모든 세팅을 한 번에 read/write 하는 방법. 2. 각각 세팅을 port에 직접 하는 방법. 1번의 경우, config를 거쳐서 한다고 생각하면 쉽고, 2번은 임시 config에 세팅한 후 free되는 방식이다. /* Create a different configuration to have ready for use. */ printf("Creating new config for 9600 7E2, XON/XOFF flow control.\n"); struct sp_port_config *other_config; check(sp_new_config(&other_config)); check(sp_set_..

this.state = { mode: 'welcome', subject: //... //... } render() { if(this.state.mode === 'welcome'){ //... } else if(this.state.mode === 'read'){ //... } } - props의 값이나 state의 값이 바뀔 때마다 그 컴포넌트의 render()함수가 다시 호출되고, 그리고 그 하위에 있는 컴포넌 트들의 render()도 호출되기 때문에 화면이 싹 다시 그려진다. - console.log('...'); 하면 콘솔에 프린트를 할 수 있다. - debugger; 를 만나면 브레이크 포인트 쓰듯이 실행 시 저 부분에서 멈춘다. - HTML로 보이지만 이건 유사 HTML이다. 규칙을 따라야한다. ..

- state는 props와 함께 가장 헷갈리는 부분 - component가 실행될 때 초기화를 담당하는 부분: constructor() constructor(props){ super(props); this.state = { subject:{title:'WEB', sub:'World Wide Web'} } } - 외부에서 볼 수 없게 은닉하는 방법이다. - 상위 component의 state 값을 하위 component의 props로 전달할 수 있다. - state는 바꿀 수 있지만 props는 전달 받기만 하고 직접 바꿀 수는 없다. // App의 consturctor 안 this.state = { contents: [ {id:1, title: 'HTML', desc: 'HTML is blar blar..

[Component 만들기] - App.js에 있는 class App에서 시작한다. 마치 main() 같은 건가? - html과 js처럼 작동을 하지만 굉장히 가독성이 좋다. - create-react-app이 알아서 변환해준다고 생각하면 된다. 깔끔히 정리해주는 역할. - 다들 props와 state에서 절망을 많이 하는 것 같다. 헷갈리는 부분인 것 같으니 집중해야겠다. {this.props.title} {this.props.sub} - 이렇게 하면 customize한 나만의 props를 속성으로 사용할 수 있다. 오픈튜토리얼스 이고잉님 강의 https://opentutorials.org/module/4058/24737 컴포넌트 제작 - React 수업소개 React의 핵심 기능인 컴포넌트를 제작하는..

The breakpoint will not currently be hit. No executable code is associated with this line. Possible causes include: conditional compilation or complier optimizations. 디버깅 중에 이런 메시지가 뜨면서 breakpoint가 잡히지 않았다. 그래서 원하는 동작을 하지 않고 프로그램이 이상하게 동작했다. Debug 모드는 괜찮은데 Release 모드에서만 왜 이렇지? 하고 Property pages에서 하나 하나 검토해봤다. 그 중 의심스러웠던 Optimization! 사실 지난 번에도 한 번 이것 때문에 고생했었다. 이젠 좀 잊지 말자. Project Property Pages..