분류 전체보기
-
HackaLearn 해커런 2021 참여 후기📢 Events 2021. 8. 15. 23:50
애저와 깃헙액션 툴을 사용하여 정적 웹 앱을 만들고 배포해보는 해커런 이벤트에 참여했다. 행사는 8월 2일부터 15일 오늘까지 2주동안 진행됐다. 오늘이 이벤트의 마지막 날이었고, 이벤트 기간동안 다른 프로젝트를 준비하느라 시간투자를 많이 하지 못해서 아쉬웠다. 그래도 마지막까지 챌린지 달리는 중! ✅ 해커런 참여 이야기 1. 디스코드 채널을 열었다. 사람들 모아서 같이 완주하면 재밌을 거 같아서 디스코드 채널을 열었다. 열여덟분이 들어와주셨다. 다들 어느정도 하고계신가 살펴보면 다들 챌린지를 거의 끝내고 계셨다. 나만 제일 열심히 안한걸로... 🤣 완주하자고 내가 디스코드를 열었으니 챌린지 하나는 끝내야지!! 하고 마지막 날 달렸다. 뿌듯하다. 2. 애저를 사용한 정적 웹앱을 만드는 방법을 배웠다. 이..
-
4월 넷째주 프론트엔드 뉴스레터📩 News Letter 2021. 4. 30. 23:08
🔖 목차 모놀리스와 마이크로 아키텍쳐 웹팩5 모듈 페더레이션과 마이크로 프론트엔드 Puppeteer로 브라우저 테스트하기 크롬 개발자 도구 Source 패널로 디버깅하기 Cheetah-Grid - 초고속 데이터 테이블 오픈소스 모듈 의존성을 그래프로 확인하기 코딩테스트 연습 컨퍼런스 정보 💡 모놀리스와 마이크로 아키텍쳐 Micro FrontEnd — Vue JS Micro frontend architecture comes to provide more consistency and ability to parallel build and test process. ease of updates and… medium.com 모놀리스 아키텍쳐 : 하나의 큰 돌덩어리처럼 프로젝트가 하나로 뭉쳐져 있는 구조. 마이크로 아..
-
4월 둘째주 프론트엔드 뉴스레터📩 News Letter 2021. 4. 9. 23:42
🔖 목차 프론트 개발자가 웹팩을 공부해야하는 4가지 이유 NPM CLI v7.0 주요기능 5개 살펴보기 코드리뷰에 대한 우리의 접근법 테스트 가능한 순수 함수 작성하기 CSS 논리적 속성과 tailwind 플러그인 성능향상을 위한 동적 import 코딩테스트 연습 💡 프론트 개발자가 웹팩을 공부해야하는 4가지 이유 Why Frontend Developers Need to be Webpack Experts 4 strong reasons to start learning Webpack in-depth today blog.bitsrc.io 1. 개발 생산성 향상 Hot module replacement (HMR) 기능은 애플리케이션 전체 새로고침을 방지해줘서 변경된곳만 업데이트 해줌. 기본적으로 뷰, 리액트 프..
-
카카오 지도 API로 서블릿&JSP 게시판 글쓰기 구현하기JAVA 2020. 12. 4. 22:10
🎯 서블릿&JSP 게시판에 카카오 지도 API를 사용한 글쓰기 기능을 구현해본다. 카카오 지도 API를 사용하여 지도 정보를 포함한 게시글 작성 기능을 구현했습니다. 지도 검색창에 키워드로 위치 검색 후 나타나는 마커를 클릭하면 지도 아래에 선택된 좌표가 표시됩니다. [저장]버튼 클릭시 게시물 내용과 함께 선택된 좌표가 DB에 저장됩니다. 개발환경: 서블릿&JSP, 마이바티스, 오라클DB 준비사항: 게시판 DB, 게시판 모델 DTO 1. 카카오 App Key 발급받기 카카오 지도 API 가이드 👉 https://apis.map.kakao.com/web/guide/ [준비하기] 영역을 읽어보고 카카오 개발자 사이트에서 자바스크립트 App Key를 발급받으세요. 2. 사용할 지도 샘플 선택 https://a..
-
스프링 컨테이너 의존성 주입 - 생성자, setter메소드 사용JAVA 2020. 11. 8. 17:05
🎯 Spring Framework의 특징과 의존성 주입 방법을 알아본다. 스프링 프레임워크 자바 엔터프라이즈(Java EE) 개발을 편하게 해주는 오픈 소스 경량급 어플리케이션 프레임워크 *엔터프라이즈란? 엔터프라이즈 어플리케이션: 기업용 프로그램을 개발하기 적합한 어플리케이션 이런 기업용 프레임워크는 보통 구조가 복잡한 편인데, 스프링은 간단한 구성으로 개발할 수 있는 경량(light-weight) 프레임워크이다. 왜 스프링을 사용할까? POJO 개발을 쉽게 할 수 있다. IoC(Inversion of Control) 컨테이너: 객체의 관리를 스프링 컨테이너에게 아웃소싱한다. 컨테이너가 코드 대신 객체의 생성과 소멸을 관리할 수 있어서 IoC(제어의 역전)이라고 부른다. configuration.xml..
-
스프링 프레임워크 STS3 설치, 개발환경 설정JAVA 2020. 10. 21. 08:58
🎯 Spring Tool Suite 3버전을 설치하고 환경설정을 해본다. 스프링3 설치하기 https://github.com/spring-projects/toolsuite-distribution/wiki/Spring-Tool-Suite-3 spring-projects/toolsuite-distribution the distribution build for the Spring Tool Suite and the Groovy/Grails Tool Suite - spring-projects/toolsuite-distribution github.com 위 저장소 링크로 들어가서 Spring Tool Suite 3.9.11 on 이클립스 4.12버전 압축파일을 다운받는다. 내 이클립스 ee 버전은 4.17이지만 이..
-
이클립스에서 Git 사용하기Git & GitHub 2020. 10. 14. 19:18
🎯 이클립스와 깃허브를 연동하고 깃으로 버전관리하는 방법을 알아본다. 이클립스에서 Git 툴 사용하기 이클립스에서 버전관리를 위한 Git 툴을 사용할 수 있다. window - show view - other... 클릭 가장 자주 사용하는 repositories와 staging 창을 선택하고 오픈한다. 화면아래에 새로운 창이 생성되었다. Git Staging 뷰에서는 변화 대기 창, 스테이징 창, 커밋메세지 입력창을 볼 수 있다. 프로젝트 버전관리하기 로컬(내가 사용하는 컴퓨터)에 프로젝트의 버전을 기록하기 위한 새로운 폴더를 생성한다. 이 폴더가 로컬의 리포지토리(저장소)가 된다. 이클립스에서 dynamic web project를 하나 생성한다. 프로젝트에서 오른쪽마우스를 클릭하고 Team - Shar..
-
jQuery 제이쿼리 이벤트, Ajax 비동기 처리JavaScript 2020. 9. 25. 23:58
🎯 자바스크립트 라이브러리 jQuery 이벤트 처리와 Ajax 비동기 처리 방법을 알아본다. jQuery 기본 Event .ready(function) HTML문서의 모든 DOM요소들이 완벽하게 사용할 준비가 되면 호출되어 function함수가 실행된다. 파라미터 안에 이벤트 핸들러나 jQuery 코드를 추가한다. 외부 리소스나 이미지와 상관없이 모든 돔 요소들이 준비되면 바로 호출되기 때문에 window.onload보다 빠르다. .on(events[,selector][,data],function) .on() 메서드는 .bind() 메서드와 마찬가지로 이벤트 핸들러를 등록하기 위하여 사용되는 메서드이다. .on() 메서드는 동적으로 생성될 요소에 대해서도 이벤트 처리가 가능하다. new $(functio..