def _is_json_key(json, key):
try:
tmp = json[key]
except KeyError:
return False
return True
| [python] quick sort 를 사용한 snmp oid 정렬 예제 (0) | 2023.12.13 |
|---|---|
| [python] snmp oid 정렬 프로그램 (0) | 2023.12.13 |
| [python] oid sort (0) | 2023.03.13 |
개인정보처리방침
<WSF> 이 (가) 취급하는 모든 개인정보는 개인정보보호법 등 관련 법령상의 개인정보보호 규정을 준수하여 이용자의 개인정보 보호 및 권익을 보호하고 개인정보와 관련한 이용자의 고충을 원활하게 처리할 수 있도록 다음과 같은 처리방침을 두고 있습니다.
| HexCode - 투명도 대응 (0) | 2022.09.28 |
|---|---|
| [Linux] 일별 파일백업 tar + gz + crontab (0) | 2022.06.22 |
| [linux] 하위 폴더 및 파일 찾아서 삭제 (0) | 2021.09.02 |
| [REACT] axio / d3 / react 16 / react 17 개발 일기 (0) | 2021.08.20 |
| [REACT] should have a unique "key" prop 을 만났을때.. (0) | 2021.06.26 |
리눅스에서 .svn 폴더를 삭제
$ find . -name '.svn' -exec rm -rf {} \;
.svn 을 다른 문자열로 변경하여 원하는 폴더/파일을 삭제할 수 있다.
| [Linux] 일별 파일백업 tar + gz + crontab (0) | 2022.06.22 |
|---|---|
| 개인정보처리방침 (0) | 2022.06.08 |
| [REACT] axio / d3 / react 16 / react 17 개발 일기 (0) | 2021.08.20 |
| [REACT] should have a unique "key" prop 을 만났을때.. (0) | 2021.06.26 |
| [REACT] ant design + 검색어 자동 완성 만들어보기 (0) | 2021.06.07 |
이글은 단순히 제가 격은 이슈를 해결하는 과정을 적은 글입니다. 올바른 방법이 아닐 수도 있습니다.
d3 chart를 사용하려고 했다가, npm build가 안되는 상태 발생..
여러가지 찾다보니,
"react": "^17.0.2", // 17버전에서 해당 라이브러리가 지원이 안되는 것 같았음. 그래서 17을 16으로 바꾸고 빌드하니 됨.
로컬로 서버를 실행하니 restapi로 데이터를 못가져오고 여러가지 에러가 발생함
생각나는 것은 <></> 이게 react 17부터 지원되는거 같음.
또 찾아보니 axio 라이브러리에서 오류가 발생 하는 것 같음.
axio 사용한 소스의 차이점은 async / await 와 주소를 풀경로로 쓴것과 안쓴것 차이.
확실한건 http-proxy-middleware 패키지를 사용해서 경로를 생략했는데 이게 안먹히는 것 같음.
기존에 사용하던 소스
function FuncLaboratory() { const [data, setData] = useState(null); const [loading, setLoading] = useState(false); const [error, setError] = useState(null); useEffect(() => { const fetchData = async () => { try { setError(null); setUsers(null); setLoading(true); const response = await axios.get( '/api/***/' ); setData(response.data); } catch (e) { setError(e); } setLoading(false); }; fetchData(); }, []); if (loading) return <div>로딩중..</div>; if (error) return <div>에러가 발생했습니다</div>; if (!data) return null; return ( <div> <MyLabTable dataSource={data}/> </div> </div> ); } |
변경한 소스
| function FuncLaboratory() { const [data, setData] = useState(null); const [loading, setLoading] = useState(false); const [error, setError] = useState(null); useEffect(() => { setError(null); setData(null); setLoading(true); axios.get('http://localhost:8888/api/***/' ).then(res => { setData(res.data); }).catch(e => { console.log((error)); setError(e); }); setLoading(false); }, []); if (loading) return <div>로딩중..</div>; if (error) return <div>에러가 발생했습니다</div>; if (!data) return null; return ( <div> <MyLabTable dataSource={data}/> </div> ); } |
| 개인정보처리방침 (0) | 2022.06.08 |
|---|---|
| [linux] 하위 폴더 및 파일 찾아서 삭제 (0) | 2021.09.02 |
| [REACT] should have a unique "key" prop 을 만났을때.. (0) | 2021.06.26 |
| [REACT] ant design + 검색어 자동 완성 만들어보기 (0) | 2021.06.07 |
| [REACT] SELECT 만들어 보기 (0) | 2021.06.07 |
vostock.kr 안드로이드용 앱에 이어 애플 IOS버전 앱도 출시가 되었습니다.
앱스토어에서 'vostock' 으로 검색하시면 다운로드 받을 수 있습니다.
앱에서 따로 권한을 요구하는 건 없으니 주식 투자에 관심 있으신 분들은 다운 받으셔서 이용 해 보시면 감사하겠습니다. (앱에 광고는 포함되어 있습니다. 앱사용시 불편함이 없도록 최소한으로 제한 했습니다)
| [vostock] 새로운 기능이 추가되었습니다. (0) | 2021.08.09 |
|---|---|
| vostock.kr 사이트 사용 설명입니다. (0) | 2021.06.24 |
| vostock.kr 안드로이드 앱이 출시되었습니다. (0) | 2021.05.24 |
| vostock.kr 사이트 업데이트가 완료되었습니다. (0) | 2021.05.19 |
| VoStock.kr 업그레이드 개발 예정.. (0) | 2021.04.20 |
이름을 무엇으로 지을까 고민 해봤는데 막상 떠오르는게 없었습니다.
하고자 하는 것은 사이트에 올라와 있는 종목들에 대해서 매수를 해볼만한 종목이라면 이후 수익률을 어떻게 될까?
또, 주변 지인분들도 검증을 할 수 있는 기능이 있으면 좋겠다고, 저 또한 제가 구축한 사이트에 상위에 노출되는 종목들이 과연 수익에 도움이 되는지가 궁금해서 시작하게 되었습니다.
일단 기능을 사용하기 위해서는 로그인이 필요합니다. 개인정보가 중요시 되는 시대에.. 최소한의 이메일도 필요없이 무엇이든 그냥 필명과 4자리 이상의 비밀번호만 가지고 처리하도록 했습니다 (인증기능구현이 귀찮아서... 그런것은 아닙니다..)
로그인을 하고 나면 각 페이지에 검증이라는 장바구니 버튼이 있는데, 맘에 드시는 종목을 담기만 하면 됩니다.
아, 최대 10종목만 담을 수 있습니다. 그리고 삭제는 3일 이후에 가능합니다. 종목 선택은 중요하니깐요.
언제든 필명 삭제와 새로 생성은 가능합니다.
여러분들의 주식투자에 도움이 되기를 바랍니다.
| [vostock] 애플 IOS버전 앱도 출시가 되었습니다. (0) | 2021.08.14 |
|---|---|
| vostock.kr 사이트 사용 설명입니다. (0) | 2021.06.24 |
| vostock.kr 안드로이드 앱이 출시되었습니다. (0) | 2021.05.24 |
| vostock.kr 사이트 업데이트가 완료되었습니다. (0) | 2021.05.19 |
| VoStock.kr 업그레이드 개발 예정.. (0) | 2021.04.20 |
volab.kr 은 실험적인 그리고 스터디의 목적으로 여러 기능들을 추가해 나가고 있습니다.
우선 BGM 컨트롤을 플레이/스탑에서 슬라이드 바(slide bar)로 변경 했습니다.
첫번째 기능인 'snmp vendor find' 에 이어서
두번째 기능으로 IPO 공모 현황 보드를 만들어 봤습니다.
좌측 상단 햄버거 메뉴를 클릭하면 확인 할 수 있습니다.
캘린더 컴포넌트를 추가해서 캘린더와 연동해서 보여주면 더 눈에 잘 들어올 것 같다는 생각이 듭니다.
추후 스터디 후에 추가할 예정입니다.
어느정도 괜찮다라고 생각되면 vostock.kr 사이트에 추가할까 생각하고 있습니다.
모두들 성투 하시기 바랍니다.
| 다시 [volab.kr] 소개. (0) | 2023.09.04 |
|---|---|
| VoLab.kr 을 소개합니다. (0) | 2021.06.26 |
이제 volab.kr, vosotck.kr, vocoin.kr 이렇게.. 벌써 도메인만 세개가 되는 군요..
도메인이 끝나가는 시점에 아직 먼 얘기지만 그땐 도메인을 하나로 합칠까 합니다.
그래서 미리 구입한게 volab.kr 입니다. (도메인 구매도 은근 홈쇼핑 지름신 같은 느낌이...)
여기에 무엇을 채워 나갈까 고민 해봤는데.. 우선 vostock.kr 과 vocoin.kr 을 링크를 걸어두고,
여러가지 실험적인 것 들, 스터디의 목적도 있고 또는 취미를 삼아 이것 저것 작은 것이라도 조금씩 만들어 나갈 생각입니다.
실험적인 걸루 snmp vendor find 라는 유틸리티성 페이지를 만들어봤습니다.
snmp 는 Simple Network Management Protocol 약자입니다. 회사에서 주 업무중의 하나가 NMS개발입니다. ^^;
이 페이지의 기능은 아주 간단합니다.
snmp vendor 번호를 인풋창에 입력하면 그 결과를 보여줍니다.
이것만 하면 너무 심심 할꺼 같아,
현재 데이터베이스에 저장되어 있는 밴더 목록의 수와 현재까지 검색한 총 건수
그리고 각 밴더별 조회 횟수를 바차트로 표현 해보았습니다.
마지막으로 랜덤 사진과 함께 잠시동안의 힐링(?)을 하시길 바라는 마음으로 오디오 플레이를 추가 했습니다.
배경음악 제목은 Three Mexican Songs 입니다.
| 다시 [volab.kr] 소개. (0) | 2023.09.04 |
|---|---|
| volab.kr - 추가기능 IPO 공모 현황 (0) | 2021.06.30 |
첨엔 몰랐는데 크롬웹에서 개발자 도구를 열어보니 아래 같은 경고가 주르륵 뜨고 있습니다.
index.js:1 Warning: Each child in a list should have a unique "key" prop.
Check the render method of `SnmpVendor`. See https://reactjs.org/link/warning-keys for more information.
at WithStyles (http://localhost:3000/static/js/vendors~main.chunk.js:15919:31)
at SnmpVendor (http://localhost:3000/static/js/main.chunk.js:890:3)
at ConnectFunction (http://localhost:3000/static/js/vendors~main.chunk.js:82625:75)
at Route (http://localhost:3000/static/js/vendors~main.chunk.js:86050:29)
at Switch (http://localhost:3000/static/js/vendors~main.chunk.js:86252:29)
at Router (http://localhost:3000/static/js/vendors~main.chunk.js:85685:30)
at BrowserRouter (http://localhost:3000/static/js/vendors~main.chunk.js:85305:35)
at div
at Provider (http://localhost:3000/static/js/vendors~main.chunk.js:82338:20)
at App
키가 중요하지 않는 컴포넌트들이라 어떻게 처리해야할지 고민 하던중에
유니크한 난수값을 주면 어떨까 해서 찾아보니 uuid() 라는 것을 사용하면 된다고 합니다.
$ npm install uuid
사용할땐 uuid 를 임포트 해주고, 사용할 컴포넌트에 추가해주면 됩니다.
import { v4 as uuidv4 } from 'uuid';
const valCount = loading ? (<div>loading...</div>) : (
vendorCnt.map(item => (
<Typography key={uuidv4()} variant="body2"> 샘플 </Typography>
))
)
| [linux] 하위 폴더 및 파일 찾아서 삭제 (0) | 2021.09.02 |
|---|---|
| [REACT] axio / d3 / react 16 / react 17 개발 일기 (0) | 2021.08.20 |
| [REACT] ant design + 검색어 자동 완성 만들어보기 (0) | 2021.06.07 |
| [REACT] SELECT 만들어 보기 (0) | 2021.06.07 |
| [REACT] 검색어 자동완성 만들어보기 (0) | 2021.06.06 |
오늘은 제가 운영하고 있는 사이트 vostock.kr 에 대해서 내용이라던지 기능에 대해서 물어오시는 경우가 종종 있어서 사이트에 대해 설명을 좀 해볼까 합니다.
앞으로도 여러가지 실험적인 내용이 추가되고 구성이 변경 될 수 도 있습니다. 참고 부탁드립니다.
앱 버전도 출시 했습니다. PlayStore 또는 AppStore 에서 vostock 또는 비오스탁이라고 검색하셔서 다운 받으시면 됩니다.
메뉴는 [Home, 재무분석, 테마/업종, IPO, 실험실, 차트분석, 조건검색, 모의투자, 방명록] 으로 구성되어 있습니다.
그냥 사이트 개발 히스토리랑 사이트에 대한 소개글이 있습니다.
문의사항이 있으시면 sunghj0816@gmail.com 으로 문의 주시면 됩니다. 또는 방명록에 글을 남기셔도 됩니다.
기본적으로 모든 화면 구성에는 종목을 클릭하면 해당 종목의 네이버 증권 사이트로 이동하고, 코드를 클릭하면 다음 빅차트로 이동합니다. (모바일에서는 빅차트로 이동하지 않습니다) , SCORE 를 클릭하면 차트분석 메뉴의 페이지로 이동합니다.
PER/업종 - 동일 업종 평균 PER 대비 해당 종목의 PER가 차지하는 비율입니다 (낮을수록 좋습니다)
PBR/업종 - 동일 업종 평균 PBR 대비 해당 종목의 PBR가 차지하는 비율입니다 (낮을수록 좋습니다)
ROE/업종 - 동일 업종 평균 ROE 대비 해당 종목의 ROE가 차지하는 비율입니다 (높을수록 좋습니다)
그날 테마와 업종군에 대해 상승율 순으로 내림차순 표시가 되고 각 테마/업종을 클릭하면 그 속에 속해 있는 종목들을 네이버 증권으로 링크됩니다. 워드크라우드는 그냥 빈칸채우기용... 입니다.
IPO 공모주 현황 종목을 보여줍니다. 자동으로 업체의 홈페이지를 찾으면 종목에 링크가 활성화 됩니다.
제가 좋아하는 보조지표는 MACD, 스토캐스틱, RSI, 볼린저밴드 등입니다. 이러한 보조지표를 가지고 매수할 만한 시점을 포착해서 마킹을 하고 총 합을 내림 차순으로 보여줍니다
MACD - 오실레이터가 최근 5일 동안 0에 가까워지면서 상승하고 있는지
스토캐스틱 - 최근 5일 이내 과매도가 발생 했는지
RSI - 최근 5일 이내 과매도가 발생했는지
Bollinger Band - 최근 5일 중 일봉이 밴드하단에 걸친후 상승하고 있는지
OBV - 최근 5일 동안 OBV가 상승유지되고 있는지
연속매수 - 최근 5일 동안 기관 또는 외인이 연속매수하고 있는지
기본적으로 삼성전자에 대한 정보를 보여주고 있고, 종목명/코드로 검색해서 볼수 있습니다.
제가 가장 많이 보는 화면인데요. 매일 자기전에 여기에 나와있는 종목들을 30분에서 1시간 정도 할애 해서 훒어봅니다.
MACD돌파와 60추세, 210추세를 주로 봅니다.
보통 점수가 50~60점 이상인 아이들을 보고, 종목코드 위에서 새창열기로 (키보드 컨트롤 + 마우슨왼클릭) 원하는 만큼 탭으로 열어놓고 하나씩 차트를 돌려봅니다. 별로인 것들은 탭에서 지웁니다. 쇼핑하듯이.. 그러다 보면 한두종목 남는데 어떤날은 아예 없는 날도 있고요.
그리곤 HTS앱에서 자동감시 주문으로 매수를 걸어놓고 잡니다.
말그대로 모의투자 현황입니다. 위의 테이블은 100만원 이상 들어간 종목. 아래 테이블은 감시차원에서(보초) 100만원 미만 매수 종목들 입니다.
도움이 되신다거나 문의 사항이나 아이디어가 있으시면 언제든 코멘트 해주셔도 됩니다.
마지막으로 요약을 하자면,
1. 조건검색 메뉴를 주로 보고 (macd , 60추세, 210추세..)
2. 다음차트에서 한번 걸러내고
3. score 가 50이상인 종목 위주로
4. 차트분석 한번 훑어보고
5. 마지막으로 재무 한번 더 훑어보고
최대한 걸러내서
매수할 종목을 자동매수 걸어놓고 잔다.. 라는 거네요. ^^
모두 성투하시길 바랍니다.
감사합니다.
| [vostock] 애플 IOS버전 앱도 출시가 되었습니다. (0) | 2021.08.14 |
|---|---|
| [vostock] 새로운 기능이 추가되었습니다. (0) | 2021.08.09 |
| vostock.kr 안드로이드 앱이 출시되었습니다. (0) | 2021.05.24 |
| vostock.kr 사이트 업데이트가 완료되었습니다. (0) | 2021.05.19 |
| VoStock.kr 업그레이드 개발 예정.. (0) | 2021.04.20 |
- 저도 공부하는 중이라 이해도가 낮아 설명에 있어서 부족한 부분이 있을 수 있습니다.
- 하지만 도움이 되실 분도 있으리라 생각합니다.
- App.js
+ src
+--- App.js
- 준비 : antd (ant design lib)
ant design ui 라이브러리를 사용하여 좀더 미려하고 쉽게 구현을 해보자
> npx create-react-app test
> cd test
> npm i antd
> code .
- 기본적인 검색어 자동 완성에 대한 코드는 아래에서 참고.
[REACT] 검색어 자동완성 만들어보기
앞서 주의사항! - 저도 공부하는 중이라 이해도가 낮아 설명에 있어서 부족한 부분이 있을 수 있습니다. - 하지만 도움이 되실 분도 있으리라 생각합니다. 검색어 자동 완성 만들어볼 것 - App
ososoi.tistory.com
antd 기본 샘플 예제
| import React, { useState } from 'react'; import ReactDOM from 'react-dom'; import 'antd/dist/antd.css'; import './index.css'; import { AutoComplete } from 'antd'; const { Option } = AutoComplete; const Complete = () => { const [result, setResult] = useState([]); const handleSearch = (value) => { let res = []; if (!value || value.indexOf('@') >= 0) { res = []; } else { res = ['gmail.com', '163.com', 'qq.com'].map((domain) => `${value}@${domain}`); } setResult(res); }; return ( <AutoComplete style={{ width: 200, }} onSearch={handleSearch} placeholder="input here" > {result.map((email) => ( <Option key={email} value={email}> {email} </Option> ))} </AutoComplete> ); }; ReactDOM.render(<Complete />, document.getElementById('container')); |
- 기본 샘플을 실행 시켜보고 내가 원하는 컨셉으로 수정~
기본 샘플 예제는 input 박스에 텍스트 입력시 그텍스트를 가지고 약속된 email 주소를 자동 완성해주는 예제
수정
- rest 서버에서 대상 데이터들을 받아왔다고 가정하고 가상 데이터들을 추가
- 테이타풀에서 매치되는 것을 찾아서 출력
| import React, { useState } from 'react'; import ReactDOM from 'react-dom'; import 'antd/dist/antd.css'; import './index.css'; import { AutoComplete } from 'antd'; const { Option } = AutoComplete; const datas = [ {value:'삼성전자'}, {value:'삼성바이오로직스'}, {value:'LG전자'}, {value:'LG화학'}, {value:'DL'}, ] const App = () => { return ( <Complete/> ) }; const Complete = () => { const [result, setResult] = useState([]); const handleSearch = (inputValue) => { let res = []; if (!inputValue) { res = []; } else { res = datas.filter(item => true === matchName(item.value, inputValue)); } console.log('setResult', res); if (res.length > 0) { setResult(res); } }; const matchName = (name, keyword) => { //console.log('matchName', name, keyword); if(name.toUpperCase().indexOf(keyword.toUpperCase()) !== -1) { console.log('matchName true'); return true; } else { console.log('matchName false'); return false; } }; return ( <AutoComplete style={{ width: 200, }} onSearch={handleSearch} placeholder="input here" // filterOption={(inputValue, option) => // option.value.toUpperCase().indexOf(inputValue.toUpperCase()) !== -1 // } > {result.map((item) => ( <Option key={item.value}> {item.value}</Option> ))} </AutoComplete> ); }; export default App; |
> npm run start
| [REACT] axio / d3 / react 16 / react 17 개발 일기 (0) | 2021.08.20 |
|---|---|
| [REACT] should have a unique "key" prop 을 만났을때.. (0) | 2021.06.26 |
| [REACT] SELECT 만들어 보기 (0) | 2021.06.07 |
| [REACT] 검색어 자동완성 만들어보기 (0) | 2021.06.06 |
| [kotlin] 안드로이드 앱에 인트로 화면 추가하기 (0) | 2021.05.25 |
- 저도 공부하는 중이라 이해도가 낮아 설명에 있어서 부족한 부분이 있을 수 있습니다.
- 하지만 도움이 되실 분도 있으리라 생각합니다.
- App.js
+ src
+--- App.js
> npx create-react-app test
> cd test
> code .
| import logo from './logo.svg'; import './App.css'; import * as React from "react"; function App() { // 데이타를 준비 const lookup = [ { id: '1', query: '001', text: '조건검색1-1' }, { id: '2', query: '001', text: '조건검색1-2' }, { id: '3', query: '001', text: '조건검색2-1' }, { id: '4', query: '002', text: '조건검색2-2' }, { id: '5', query: '002', text: '조건검색2-3' } ]; // state 사용 const [selected, setSelected] = React.useState(""); // 셀렉트 컴포넌트가 변경될때 불려짐 const changeSelectOptionHandler = (event) => { setSelected(event.target.value); }; // 선택된 아이템에 따라 값을 비교하고 데이타를 리턴 var inquiries = lookup.filter(data => { if (selected === "001" && data.query.toLocaleLowerCase() === "001") { return data; } else if (selected === "002" && data.query.toLowerCase() === "002") { return data; } }) return ( <div style={{ padding: "16px", margin: "16px", }} > <div> {/** onChange 될때 changeSelectOptionHandler 함수가 불려지도록 바인드 */} <select onChange={changeSelectOptionHandler}> <option value="001">조건검색1</option> <option value="002">조건검색2</option> </select> </div> <div> {/** inquiries의 모든 텍스트를 출력 */} {inquiries.map(inquiry => ( <h3 >{inquiry.text}</h3> ))} </div> </div> ); } export default App; |
> npm run start
| [REACT] should have a unique "key" prop 을 만났을때.. (0) | 2021.06.26 |
|---|---|
| [REACT] ant design + 검색어 자동 완성 만들어보기 (0) | 2021.06.07 |
| [REACT] 검색어 자동완성 만들어보기 (0) | 2021.06.06 |
| [kotlin] 안드로이드 앱에 인트로 화면 추가하기 (0) | 2021.05.25 |
| [react] 네비게이션바 F5 누르면 상태가 초기화 되는 현상 해결 (0) | 2021.05.18 |
- 저도 공부하는 중이라 이해도가 낮아 설명에 있어서 부족한 부분이 있을 수 있습니다.
- 하지만 도움이 되실 분도 있으리라 생각합니다.
- App.js, SearchBar.js (파일 생성)
+ src
+--- App.js
+--- SearchBar.js
> npx create-react-app test
> cd test
> code .
| // App.js import './App.css'; import React, { useState } from "react"; import SearchBar from './SearchBar'; // App.js 에 기본적으로 추가되는 코드를 정리하고 심플하게 만듦 function App() { //검색에 필요한 원천 데이타, 검색어, 결과값 const data = [ {"name":"키움증권", "code":"000000"}, {"name":"삼성전자", "code":"000002"}, {"name":"LG전자", "code":"000003"}, {"name":"스튜디오드래곤", "code":"000004"}, {"name":"영호화학", "code":"000005"}, {"name":"씨젠", "code":"000006"}, {"name":"LG화학", "code":"000007"}, {"name":"DL", "code":"000008"}, {"name":"오뚜기", "code":"000009"}, ]; const [keyword, setKeyword] = useState(); const [results, setResult] = useState([]); // 필드를 업데이트 const updateField = (field, value, update = true) => { if (update) onSearch(value); if (field === 'keyword') { setKeyword(value); } if (field === 'results') { setResult(value); } } // 입력된 텍스트로 data 배열에서 찾아 매칭되는 결과들을 저장 const onSearch = text => { var results = data.filter(item => true === matchName(item.name, text)); setResult({ results }); }; // 검색해야할 문자열을 키워드와 비교하여 매칭이 되는지 체크 const matchName = (name, keyword) => { var keyLen = keyword.length; name = name.toLowerCase().substring(0, keyLen); if (keyword === "") return false; return name === keyword.toString().toLowerCase(); }; return ( <div className="App"> Search Auto Complete <SearchBar keyword={keyword} results={results} updateField={updateField}></SearchBar> </div> ); } export default App; |
| // SearchBar.js import React from "react"; // 키워드, 결과값들, 업데이트필드를 전달받는다 const SearchBar = ({ keyword, results, updateField }) => { // const updateText = text => { //console.log('update text', text); updateField("keyword", text, false); updateField("results", []); }; var renderResults; const arr = results['results']; if(arr) { // arr 에 검색어에 대한 결과가 담기면, SearchView 호출 renderResults = arr.map((item => { return ( <SearchView updateText={updateText} name={item.name} code={item.code} key={item.code} /> ); })); } // onChange를 사용하여 글자를 입력할때마다 updateField호출하고 renderResults를 그린다. return ( <div className="auto"> <input className="search-bar" placeholder="Search" value={keyword || ''} onChange={e => updateField("keyword", e.target.value)} /> <div className="search-results">{renderResults}</div> </div> ); }; // 검색된 아이템 "naem" "code" 출력 // 결과값을 클릭하면 updateText를 호출하여 input에 name을 표시 const SearchView = ({ name, code, index, updateText }) => { //console.log('search view:', name); return ( <div onClick={() => updateText(name)} className={`search-preview ${index === 0 ? "start" : ""}`} > <div className="first"> <p className="name">{name}</p> <p className="code">{code}</p> </div> </div> ); }; export default SearchBar; |
> npm run start
| [REACT] ant design + 검색어 자동 완성 만들어보기 (0) | 2021.06.07 |
|---|---|
| [REACT] SELECT 만들어 보기 (0) | 2021.06.07 |
| [kotlin] 안드로이드 앱에 인트로 화면 추가하기 (0) | 2021.05.25 |
| [react] 네비게이션바 F5 누르면 상태가 초기화 되는 현상 해결 (0) | 2021.05.18 |
| [react] 웹 프레임 창 타이틀 수정 (0) | 2021.05.17 |
설치파일은 NePanKing.msi 입니다. (맨 아래에 있습니다)
현재 이메일 등록/인증 기능은 제거했습니다.
기본 설치시 프로그램 파일은 여기에 위치합니다. [ C:\Program Files (x86)\NePanKing ]
자세한 사용 방법은 아래 링크를 보시면됩니다.
문의사항이 있으시면 댓글을 다셔도 되고, 메일로 연락을 주셔도 됩니다 (sunghj0816@gmail.com)
프로그램이 도움이 되신다면 후원도 한번 고려해 주세요^^~ (후원계좌는 프로그램 화면에 정보메뉴에 있습니다)
감사합니다.
[네판왕] 네이버 광고 키워드 검색량 프로그램 설치 및 제거
설치 설치하기에 앞서 닷넷 런타임 모듈이 설치가 되어 있어야합니다. 프로그램 설치 후 실행시 런타임 오류가 발생하는 경우에는 아래 페이지에서 닷넷 프래임웍 4.5.2 를 설치해주시고 다시 실
ososoi.tistory.com
네이버 광고 키워드 검색량 프로그램 시작하기 (네판왕)
시작하기에 앞서 현재 버전은 v1.0.1 입니다. ! 프로그램 사용은 누구나 메일 인증만 되면 자유롭게 사용 할 수 있습니다. 더 좋은 프로그램으로 보답 할 수 있도록 노력하도록 하겠습니다. 여러
ososoi.tistory.com
설치파일
| [네판왕] 앱버전이 출시되었습니다. (0) | 2023.10.11 |
|---|---|
| [네판왕] 네이버 쇼핑 검색어 트랜드를 통한 상품수 검색량 리뉴얼 (0) | 2023.09.10 |
| [네판왕] 네이버 광고 키워드 검색량 무료 프로그램 업데이트 (0) | 2021.01.16 |
| [네판왕] 네이버 광고 키워드 검색량 무료 프로그램 재소개 (0) | 2020.08.01 |
| 네판왕 설치하기(네이버 광고 키워드 상품수 검색 프로그램) (0) | 2020.07.12 |
준비물 : 로고로 쓰일 이미지 원본 (사이즈는 1080 x 1920 정도가 적당하다고 합니다)
저는 파일명:logo.jpg, 512x512 사이즈로 준비해봤습니다.
- intro_layout.xml 이라고 네이밍
| <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/my_image" /> </LinearLayout> |
intro_layout.xml 내용을 위와 같이 만들어 줍니다. @drawable/[로고로 쓰일 이미지 파일명]
저는 logo 이기 때문에 @drawable/logo
내용은 MainActivity 있는 껍데기 것을 고대로 가져다가 만들어줍니다.
R.layout.activity_main 을 R.layout.intro_layout 으로 변경했습니다.
| package com.kkassak.vostock import android.support.v7.app.AppCompatActivity import android.os.Bundle class IntroActivity: AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.intro_layout) } } |
| package com.kkassak.vostock import android.content.Intent import android.support.v7.app.AppCompatActivity import android.os.Bundle import android.os.Handler class IntroActivity: AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.intro_layout) var handler = Handler() handler.postDelayed({var intent = Intent(this, MainActivity::class.java) startActivity(intent) }, 1000) } override fun onPause() { super.onPause() finish() } } |
붉은색 글씨를 봐주세요. 새로운 액티비티를 추가하고 main <-> intro 를 바꿔줍니다
| <?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.kkassak.vostock"> <application android:usesCleartextTraffic="true" android:allowBackup="true" android:icon="@mipmap/ic_launcher" android:label="@string/app_name" android:roundIcon="@mipmap/ic_launcher_round" android:supportsRtl="true" android:theme="@style/Theme.AppCompat.NoActionBar"> <activity android:name=".IntroActivity" android:theme="@style/Theme.AppCompat.NoActionBar"> <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity> <activity android:name=".MainActivity"></activity> </application> <uses-permission android:name="android.permission.INTERNET" /> </manifest> |
| [REACT] SELECT 만들어 보기 (0) | 2021.06.07 |
|---|---|
| [REACT] 검색어 자동완성 만들어보기 (0) | 2021.06.06 |
| [react] 네비게이션바 F5 누르면 상태가 초기화 되는 현상 해결 (0) | 2021.05.18 |
| [react] 웹 프레임 창 타이틀 수정 (0) | 2021.05.17 |
| [postgresql] pg_dump (0) | 2021.05.12 |