분류 전체보기
-
React 기초 : function 기능 -> 함수형 Component 정의하기컴퓨터 알아가기/React 2021. 6. 7. 19:30
이제는 기본구조에서 조금은 변형을 해 보겠습니다. 아마도 이 개념까지 보시면 React가 이렇게 구성이 되는구나 하는 느낌이 오실겁니다. ▒ render( )함수 없이 바로 함수기능 사용하기 변수값을 설정해서 음식값을 나타내는 코딩을 해 보겠습니다. 역시 Codepen에서 연습해 보죠. 지난 시간에 class를 지정하고 component를 상속받아 render( )함수를 사용했는데 이 부분을 빼고 function 기능을 바로 사용합니다. ▶ 김치찌개가 8,000원인 내용을 ReactDOM.render( )함수를 이용해서 나타내 보죠. 1. function 함수 component를 만들어서 정의 : foodInfo(food)라는 component 생성 2. 정의된 component를 나타내는 return(..
-
React 기초 : Codepen을 이용한 React 사용설정컴퓨터 알아가기/React 2021. 6. 4. 19:30
지난 시간 React의 기본적 내용에 대해서는 알아보았고 이제부터는 왜 최근에 많은 개발자들이 React 언어를 사용하는지 웹상에서 구현되는 HTML과 CSS 만으로는 어떤 한계가 있는지 하나하나 뜯어보면서 느껴보도록 할 예정이다. 나 또한 전혀 프로그래밍이라는 분야는 너무도 생소한 분야기에 천천히 이해를 하면서 글을 연재하고자 한다. 만일 이 블로그를 보는 분이 있다면 이 연재를 읽는 것만으로 이해가 되면 좋겠다라는 작은 소망으로 시작하고자 한다. 많은 블로그와 구글 유투브에서 참조헤서 진행하는 만큼 완벽하지 않을 수 있지만 작은 프로그램 하나 만드는 기쁨이 반드시 올 것임을 확신하며 초반에 참조는 '동빈나 님의 React 강좌'를 기초로 공부하고 나름 대로 정리한 내역이다. ▒ React 간단 소개 ..
-
React 기초 : 기본구조컴퓨터 알아가기/React 2021. 6. 3. 15:20
오늘은 React 기본구조를 한번 보도록 하겠습니다. 저처럼 프로그램의 깊은 지식이 없는 분들은 어떤 구조로 어떻게 움직이는지 전혀 감을 잡을 수 없습니다. 일단 가장 기본적인 뼈대부터 이해를 하고 가야겠습니다. 설명이 100% 맞을 수 없지만 웹사이트를 만드는 프레임은 HTML, 그 프레임을 꾸며주는 스타일링은 CSS, 그리고 주요 기능을 작동하게 만드는 프로그램인 JvaScript로 구성이 되는데 이 JavaScript를 효과적 효율적 프로그래밍이 가능하게 만드는 언어가 React라는 개념으로 보겠습니다. ▒ React 기본 구조 Codepen에서 개발환경을 설정하였으니 그 곳에서 시작을 해 보도록 하겠습니다. HTML CSS JS(Babel)환경이 설정 되어 있으니 각 section에서 코딩을 해 ..
-
React 언어에 대해서컴퓨터 알아가기/React 2021. 6. 2. 19:30
우리는 간단한 어플을 만들기 위해 React Native라는 프로그램을 통해서 Expo로 안드로이드 앱을 만들어 보았다. 그런데 이제까지 HTML과 CSS에 대한 개념을 이해하기 위해 몇가지 퀴즈도 풀면서 컴퓨터언어에 대한 거부감을 많이 줄여봉ㅆ다. 사실 나는 이정도만 알고 모든 것을 구글링에서 해결할려고 했다... 조금씩 내용을 알다보니 내가 무엇을 찾는지 알아야 구글링을 정확히 하고 어느곳에 정확히 반영하는지 필요성을 느끼게 되었다. 그렇다면 조금 더 기본적인 컴퓨터 언어의 흐름은 알아야하지 않을까 하는 어쩔수 없음에 직면하게 되었다. 휴... 다시 생각해 보면 비록 내가 개발자는 아니지만 내 스스로 조금씩 만들어 내는 결과물에 만족을 느끼게 되니 자연스럽게 더 배우고자 하는 것 같다. 현재까지 이러..
-
블록체인의 코어기술 : 작업증명(Proof of Work, PoW)몰상식 (몰라도 되는 상식) 2021. 6. 1. 19:30
블록체인(Block Chain)의 핵심 기술인 작업증명(Proof of Work)애 대해 이야기를 해볼까 합니다. 역시 암호화폐가 거래될 때 외부로부터 해킹 등 취약한 보안을 극복한 처리방식으로 생각하면 되는데 그러한 작업을 증명한다라고 보면 될 것 같습니다. 그렇다면 어떤 작업을 증명하는 것일까요? 작업증명(Pow)은 해시(Hash)값을 구하는 과정이라고 합니다. ☞ 해시(Hash) 해시는 다양한 길이를 가진 데이터를 고정된 길이의 데이터로 대응(mapping)시킨 값입니다. 좀 더 구체적으로 보면 특정한 데이터를 상징하는 다른 길이의 데이터로 변환하는 행위를 말하는데 글자하나만 달라도 완전히 다른 문자열로 변환되기때문에 무결성과 보안성을 띕니다. 우리가 알고자 하는 해시의 보안성은 출력값을 토대로 입..
-
블록체인 (Block Chain)의 개념과 원리몰상식 (몰라도 되는 상식) 2021. 5. 31. 19:30
202년 한국은 주식광풍에 이어 암호화폐로 자금이 몰린다고 합니다. 암호화폐라는 개념을 개념을 몰라도 '비트코인'이라는 이야기는 이제 남녀노소 누구나 알고 있는 듯 합니다. 정확히 기억은 나지 않지만 약 15년전 같아요. 그때 비트코인이 미래의 화폐를 대신한다라는 이야기를 들어서 사두는게 좋지 않을까 하는 주위 이야기가 있었습니다만 실체도 없고 어디 쓸데도 앖는데 무슨 화폐가치가 있겠느냐라는 생각이었고 당시에 1비트코인이 몇십만원이라고 해서 그 돈 있으면 치킨을 먹겠다라고 생각한 기억이 아직까지 있네요. 제가 알고 있는 비트코인은 일본이름을 쓰는 사토시...가 컴퓨터 프로그램을 이용하여 거대한 연산문제를 풀게 되었는데 그 문제의 단계가 넘어갈때마다 비트코인이 하나씩 생성이 된다. 그래서 그 문제를 푸는 ..
-
VS code에서 Jupyter Notebook사용: 랜덤하게 로또번호 추출컴퓨터 알아가기/알아두면 편한 팁 2021. 5. 28. 19:30
지난 시간에 Visual Studio Code에서 Jupyter Notebook 사용 환경을 설정 하였습니다. 이제는 이 환경에서 로또번호 추출하는 프로그램을 공부해볼까 해요. 우선 전체적인 시스템 돌아가는 개념이 아직 약하기 때문에 실행파일을 만들어 주는 Pyinstaller부터 설정하고 가겠습니다. (필요 없을수도 있는데 혹시 몰라서 설치해 봅니다.) ▒ Pyinstaller 설치 (참고) Pyinstaller는 Jupyter Notebook에서 만든 프로그램을 Anaconda Prompt 명령어 창에서 Python 프로그램을 실행시킬때 사용합니다. Pyinstaller는 Python으로 만들어진 파일 ".py"을 배포하거나 실행할 때 사용하는 프로그램입니다. Python으로 만들어진 프로그램이 작동..
-
Visual Studio Code : Jupyter Notebook 설정 및 실행하기컴퓨터 알아가기/알아두면 편한 팁 2021. 5. 26. 19:30
지금까지 꾸준하게 사람들이 구매하고 행운을 기대하는 로또라는 복권이 있습니다. 물론 노력하지 않고 큰 재물을 바라는 마음은 사람의 기본 속성인지도 모르겠습니다만 일반인이 우리들에게는 사실 그러한 행운이 발생하기 쉽지는 않습니다. 뉴스를 통해서 로또 1등이 된 분들이 안좋게 된 경우도 보았지만 한편으로는 1등 당첨이 되기만 하면 좋겠다라는 마음이 더 강한 것은 사실입니다. 그러다 문득 1부터 45까지 로또번호를 생성하는 프로그램은 어떤 원리일까라는 궁금증이 들더군요. 여기저기 찾아보고 한번 연습해 봐야겠습니다. 그러기 위해서 Python이라는 프로그램을 이용하여 코딩을 하고자 하는데 좀 더 익숙한 환경인 Visual Studio Code에서 Jupyter Notebook을 설정하고 프로그램을 공부해 보겠습..