728x90 반응형 전체 글303 REACT] Bulma css framework bulma.io/ Bulma: Free, open source, and modern CSS framework based on Flexbox Bulma is a free, open source CSS framework based on Flexbox and built with Sass. It's 100% responsive, fully modular, and available for free. bulma.io 다음 터미널 command로 Bulma CSS framework를 추가한다. $ npm install bulma index.js에 bulms.css를 추가한다. import 'bulma/css/bulma.css'; App.js에 Bulma message multi-part component를 추가해보자.. 2020. 10. 12. REACT] React Router, React Media 디바이스 스크린의 사이즈에 따라, 다른 route를 제공하는 user dashboard application을 만들어보자. Step1 - Setting Up the Project 프로젝트 시작을 위해, npx와 create-react-app을 사용하여 새로운 React application을 만든다. create-react-app으로 리액트 프로젝트를 생성할 때, 2가지 방법이 있다. 첫 번째 방법 : npm install -g create-react-app create-react-app my-app cd my-app npm start 첫 번째 방법은, creat-react-app을 글로벌 모듈로 설치한 다음, 사용하는 방법이다. 이 방법은 모듈의 업데이트 여부가 확인이 불가능하여, 이전 버전을 사용할 .. 2020. 10. 12. React] 배열 렌더링 How To Render Arrays in React 소개 리액트에서 배열을 렌더링 할 수 있는 방법들을 소개한다. Rendering Multiple Elements multiple JSX 요소를 렌더링 하기 위해서, .map() method로 배열을 루프 돌고, 하나의 element를 return 할 수 있다. render() { const fruits = ["Apple", "Orange", "Banana"]; return fruits.map((reptile) => {reptile}); } 다음과 같이 렌더링 된다. Apple Orange Banana Console 탭을 보면, 경고문구를 확인할 수 있다. component에 collection을 렌더링 하려면 반드시 key를 추가해야 한다. 리액트에서 유일한 key는 collection에서 어떤 comp.. 2020. 10. 8. MSSQL] OPENQUERY 사용으로 실행속도 개선 사내 인프라 운영시, MSSQL 연결된 서버의 데이터를 연동하는 일이 많아서, 아래와 같이 데이터를 조회해오는 일이 많다. SELECT [컬럼명] FROM [연결된 서버별칭].[데이터 베이스명].[데이터베이스 소유자명].[테이블명] WHERE [조건절] 하지만 위와 같이 사용하면, 해당 테이블을 FULL SCAN하게 된다. 속도 개선을 위해, 연결된 서버로 조건절을 전달하여 필요한 데이터만 가져올 수 있도록 OPENQUERY를 사용한다. 아래와 같이 OPENQUERY로 조회해오는 프로시저를 만들어서 사용하는 것이 편리하다. CREATE PROCEDURE [dbo].[procLinkedServer] ( @searchText VARCHAR(10) ) AS SET Nocount On; SET TRANSAC.. 2020. 10. 7. C#] XSS(Cross-site Scripting) - 스크립트 필터링 크로스사이트 스크립팅 악의적인 사용자가 공격하려는 사이트에 스크립트를 넣는 기법 보안위협 웹 사이트 게시판, URL등에 악의적인 스크립트를 삽입하여 사용자의 쿠키(세션)를 도용하거나 악성코드(URL 리다이렉트)를 유포할 수 있다. 취약한 코드 사용자 입력 값에 대한 검증 및 필터링이 이루어지지 않으며, HTML코드가 입력실행되는 경우 조치방법 사용자로부터 입력받는 인수값에 대해서는 검증 로직을 추가하거나, 부득이하게 게시판에서 HTML을 사용하는 경우 HTML코드 중 필요한 코드에 대해서만 입력 가능하도록 설정 1. 검색어에서 XSS를 방지하기 위해, 특수기호 필터링 public String CleanInput(string strIn) { // Replace invalid characters with e.. 2020. 10. 6. MSSQL] 구버전 SSMS 에서 JSON 파싱 최신 SSMS에서는 OPENJSON 함수를 사용하여, JSON String의 key와 값 추출이 가능하다. OPENJSON을 제공하지 않는 구버전 SSMS는 아래 함수 만들어서 사용가능하다. create FUNCTION [dbo].[fnGetJsonValue](@key varchar(100), @data nvarchar(max)) RETURNS nvarchar(max) AS BEGIN DECLARE @keyJson varchar(105) = '"' + @key+ '":' DECLARE @keyIdx int = CHARINDEX(@keyJson, @data) IF @keyIdx = 0 RETURN null DECLARE @valueIdx int = @keyIdx + LEN(@keyJson) DECLARE .. 2020. 10. 6. 이전 1 ··· 46 47 48 49 50 51 다음 728x90 반응형