본문 바로가기

전체 글

 (99)
[React Native] Select, 라디오 버튼, 체크박스 1. Select import React, { useState } from "react"; import { Button, View } from "react-native"; import SelectBox from 'react-native-multi-selectbox-typescript'; /* import RNPickerSelect from 'react-native-picker-select' const values = [ { label: "Football", value: "축구" }, { label: "Baseball", value: "야구" }, { label: "Hockey", value: "하키" }, ]; const App = () => { const [pickerSelect, setPickerSe..
[React Native] Hook : useState 1. useState는 배열 괄호안에 getter와 setter 개념으로 변수를 선언하여 사용할 수 있으며, 초기값 지정이 필요하다. import React, { useState } from "react"; import { Button, Text, View } from "react-native"; /* class App extends React.Component { constructor(props: any){ super(props) this.state = { count: 0 } } render() { return ( You clicked { this.state.count } times this.setState({ count: this.state.count + 1 }) } /> ) } } export de..
[React Native] 모듈 import하여 사용하기, 다른 모듈에 값 전달해주기 1. App.tsx에서 사용할 모듈 : props(태그의 속성으로 전달되는 값)를 받아서 name과 age 속성을 각 컴포넌트에 표시해줌. // Welcome.tsx import React from "react"; import { View, Text, StyleSheet, Platform } from "react-native"; function Welcome(props:any) { return ( Hello Welcome {props.name} Age {props.age} ) } const styles = StyleSheet.create({ text: { fontFamily: Platform.select({ android: "serif" }), fontSize: 30 } }) export default ..
[React Native] 컴포넌트 다루기, 클래스형 컴포넌트와 함수형 컴포넌트 1. 컴포넌트에 자바스크립트 변수 값 넣기 : {} 사용 import React from "react"; import { SafeAreaView, Text } from "react-native"; export default function App() { const str = "Hello World"; return ( Hello TSX World! {str} ); } 2. 자바스크립트의 boolean 값에 따라 리턴할 컴포넌트 지정하기 import React from "react"; import { SafeAreaView, Text } from "react-native"; export default function App() { const isLoading:boolean = true if(isLoading..
Jsoup 사용하여 웹페이지 크롤링하기 Jsoup은 Java의 라이브러리로 웹 문서에 대한 크롤링 기능을 제공한다. Maven Repository에서 Jsoup을 검색하면 여러 목록이 보이는데 거기에서 "Jsoup Java HTML Parser"를 클릭하면 다음과 같이 라이브러리를 다운로드 할 수 있는 페이지로 연결된다. 최신 버전중에 사람들이 많이 다운로드받은 1.13.1 버전을 받아 사용하였다. Maven이나 Gradle 프로젝트였다면 의존성 관리를 통해 추가해줄 수 있지만, 순수 자바로 할 것이기 때문에 jar파일을 다운로드 해주었다. 프로젝트 구조에서 모듈 -> 종속요소에 다운로드 받은 jar 파일을 넣어주고 적용한다. 그러면 Jsoup을 사용할 준비가 된 것이다. 파일 구조는 다음과 같다. 크롤링할 자료는 어떤 블로그의 제목과 글 내..
[Spring Boot] 게시판 기능 구현하기(3) 답글 등록 및 글 수정/삭제 Mapper UPDATE BBS SET STEP = STEP + 1 WHERE REF = (SELECT * FROM (SELECT REF WHERE SEQ = #{seq}) AS BB) AND STEP > (SELECT * FROM (SELECT STEP WHERE SEQ = #{seq}) AS BB2) INSERT INTO BBS (SEQ, ID, REF, STEP, DEPTH, TITLE, CONTENT, WDATE, DEL, READCOUNT) VALUES (NEXTVAL('SEQ_BBS'), #{id}, (SELECT REF FROM BBS AS BB3 WHERE SEQ = #{seq}), (SELECT STEP FROM BBS AS BB4 WHERE S..
[Spring Boot] 게시판 기능 구현하기(2) 게시글 리스트에 페이징 기능 추가하기 라이브러리 준비 웹 브라우저는 화면에서 벗어나는 내용을 스크롤을 통해 보여주기 때문에 게시판 내에서 게시글의 리스트가 너무 많으면 사용자가 불편함을 호소한다. 그래서 웹에서는 페이징이라는 개념을 통해 한 페이지 당 보여줄 게시글 리스트를 조절할 수 있다. 페이징 기능을 사용하기 위해 라이브러리가 준비되어야 한다. https://github.com/josecebe/twbs-pagination 여기에서 jquery.twbsPagination.min.js라는 파일이 필요하며 전체적인 화면단을 보여주는 프로젝트의 구성은 다음과 같다. front |_ index.html |_ img |_ arrow.png |_ auth |_ account.html |_ login.html |..
[Spring Boot] 게시판 기능 구현하기(1) CRUD를 연습하기에 가장 좋은 기능이 게시판 구현이라고 생각한다. DB 구축하기 게시판 테이블 생성 DB 테이블을 구축하기 위해 다음 쿼리문을 작성해준다. show databases; use mysql; DROP TABLE BBS; CREATE TABLE BBS( SEQ INTEGER(8) PRIMARY KEY, ID VARCHAR(50) NOT NULL, REF INTEGER(8) NOT NULL, STEP INTEGER(8) NOT NULL, DEPTH INTEGER(8) NOT NULL, TITLE VARCHAR(200) NOT NULL, CONTENT VARCHAR(4000) NOT NULL, WDATE DATE NOT NULL, DEL INTEGER(1) NOT NULL, READCOUNT I..

티스토리툴바