웹 디자이너 및 개발자를위한 새로운 리소스 (2018 년 8 월)
지난 몇 개월 동안 출시 된 새로운 도구가 상당히 많아짐에 따라 개발 커뮤니티가 최근 활발해진 것 같습니다. 이번 연재에서 언급할만한 몇 가지 도구를 중점적으로 다룰 것입니다..
도구 목록 중에는 더미 데이터를 생성하는 JavaScript 라이브러리, 로컬 네트워크 내에서 파일을 공유하는 도구, 터미널 세션을 SVG 애니메이션으로 기록 할 수있게 해줄 것이다. 멋진데? 아래의 전체 목록을 확인합시다..
Pushbar.js
슬라이딩 서랍을 만들기위한 JavaScript 라이브러리입니다. 일반적으로 슬라이딩 서랍은 사이트 메뉴 탐색을 표시하는 데 사용되지만이 라이브러리를 사용하여 사이트에 적합한 것을 표시 할 수 있습니다. Pushbar.js는 완벽하게 사용자 정의 가능하며 종속성이 없으며 jQuery가 필요하지 않습니다..

Carbon Now CLI
Carbon CLI는 다음과 같은 Node.js 패키지입니다. 코드 스크린 샷 생성 커맨드 라인 인터페이스를 통해 아름답게. 이 도구는 브라우저에서 멋진 GUI를 통해 동일한 작업을 수행 할 수있는 carbon.now.sh에서 영감을 얻었습니다..

Faker.js
자바 스크립트 라이브러리 더미 데이터를 만든다.. 이름, 우편 주소, 회사 이름, 전화 번호, 날짜 등과 같은 대량의 데이터 생성을 지원합니다. 이 모든 데이터는 웹 응용 프로그램 테스트.

TermToSVG
TermToSVG는 리눅스 터미널 레코더 명령 줄 세션을 SVG 애니메이션으로 렌더링합니다. 튜토리얼을 작성하는 개발자에게 유용한 도구입니다..

데이터베이스 백업 관리자
그것은 PHP 라이브러리이며, 이름에서 알 수 있듯이, 데이터베이스 백업 및 복원 처리. 라이브러리는 Dropbox, Amazon S3, FTP 및 SFTP 및 Rackloud Cloud를 포함하여 백업을 보내거나 가져 오는 다양한 서비스를 지원합니다.

반응하는 비트
다양한 React.js 기술, 팁 및 트릭 인 React Bits는 일반적인 디자인 패턴, 스타일 및 성능 팁을 다룹니다. 이것은 진실로 React.js 기술을 높이기위한 훌륭한 리소스.

DSS 언어
DSS는 새로운 CSS 작성 도구 인 Deterministic StyleSheets의 약자입니다. 어떻게 작동하며 이것이 일상 업무에 어떻게 적용될 수 있습니까? 나는 정직하게 지금까지 전혀 모른다. 그러나 그것은 멋지다. 그리고 그것은 새롭다. 그래서 그것은 목록 위에있다. 고맙습니다!

퍼지 CSS
PurgeCSS는 다음을 허용하는 NPM 패키지입니다. CSS 출력 최적화 사용하지 않는 웹 애플리케이션을 제거하여 웹 애플리케이션에서 이 도구에는 Gulp, Grunt, Grunt, Webpack 및 PostCSS를 포함하여 다양한 내장 도구 지원이 있으므로 프로젝트에 통합 곧.

RFS
RFS는 Responsive Font Size (응답 글꼴 크기)의 약자로 웹상에서 가장 어려운 것 중 하나를 다루는 흥미로운 프로젝트입니다. 글꼴 크기를 반응 적으로 만든다., 크기가 기기의 뷰포트 크기에 따라 적절하게 조정됩니다. RFS는 NPM으로 제공됩니다.

SimpleBar
사용자 정의 스크롤 막대를 생성하는 JavaScript 라이브러리 인 SimpleBar를 사용하면 다른 HTML 요소와 마찬가지로 CSS를 사용하여 사이트 스타일을 일치시킵니다. 그 자리에서. 플랫폼 및 브라우저 제한으로 인해 브라우저 스크롤바의 스타일을 복잡하게 만드는 데 사용했지만 SimpleBar를 사용하면 간단하게 만들 수 있습니다..

Larastan
Larastan은 Laravel을위한 PHPStan. PHPStan은 단위 테스트를 작성할 필요없이 잠재적 오류에 대한 코드를 확인할 수있게 해주는 도구입니다. 호출 된 메소드와 함수의 존재, 프로퍼티에 할당 된 타입, 클래스 생성자에 할당 된 수와 타입, phpDocs의 유효성 검사를 포함한 수많은 것들을 검사합니다.

PWMetrics
PWMetrics는 Paul Irish가 개발 한 명령 줄 인터페이스를 통해 Progressive Web Apps 메트릭을 수집하는 도구입니다. 이 도구는 등대에 의해 구동되며 NPM 패키지로 제공됩니다. 다양한 옵션을 제공합니다. 메트릭 구성, 테스트 성능, 시험에서 벗어나고 싶다는 기대감.

팍스
Pax는 JavaScript 모듈을 브라우저 용으로 사용할 수있는 파일로 컴파일. 팍스는 속도를 약속합니다. 일부 번들보다 빠르게 컴파일됩니다. ES6을 완벽하게 지원합니다. 수입
과 수출
구문과 CommonJS sytax 수입
. 같지 않은 팍스
Rust로 쓰여지고 Cargo라는 Rust 패키지 레지스트리를 통해 사용할 수 있습니다..

SustyWP
SustyWP는 더 나은 원인을 목표로하는 WordPress 테마; 가능한 한 작게 크기를 줄임으로써 탄소 발자국을 줄입니다. 브라우저에로드 할 때 무게는 7-6kb입니다. 그 빠르고 가벼운, 그 대가로 사이트를로드하는 데 필요한 자원 (예 : 전기)을 적게 소비합니다. 잭 레녹스 (Jack Lenox)의이 게시물에서 주제 뒷 이야기를 확인하십시오..

낙서 라이브러리
에이 기념일 로고 그림 모음, 낙서 도서관에는 컬렉션에 많은 그림이 있으며 얼굴, 장소, 동물 등 여러 범주로 그룹화됩니다.. 도면은 SVG 형식으로 사용할 수 있습니다. Creative Common Attributions 4.0에 따라 배포됩니다.

Tilt.js
jQuery 플러그인 공상을 만들어라. 경사 효과 Apple TV에서 본 미리보기 이미지와 유사합니다. 추가적인 CSS가 필요하지 않습니다. 그것들은 또한이 페이지에서 몇 가지 구현 예제를 제공하므로 사용은 매우 간단합니다. 너를 확인해. 눈부심 효과를 확인하십시오.; 정말 멋지다.

Fileroom
Fileroom은 다음 용도의 웹 응용 프로그램입니다. 동일한 네트워크 내에서 피어 - 투 - 피어 파일 공유. OS에 관계없이 드래그 앤 드롭만으로 동료와 파일을 공유 할 수 있습니다. 그것은 Windows, MacOS, Linux에서 작동합니다..

Coolhue
손으로 선택한 그라디언트 색상 모음 인 Coolhue를 사용하면 Photoshop 및 Sketch 응용 프로그램의 색상 팔레트 견본을 가져올 수 있습니다. 프로젝트에 설치하십시오. ~을 사용하여 나무 그늘
또는 npm
. 이렇게하면 다가올 웹 사이트의 색상을 선택할 시간이 절약됩니다..

암초
UI를 생성하는 간단한 자바 스크립트 라이브러리 인 Reef는 React.js 나 Vue.js와 같은 더 큰 라이브러리의 모든 종소리와 휘파람을 가지고 있지 않습니다. 그러나 필요한 것은 UI, 데이터 입력 만 렌더링 템플 리프는 훌륭한 대안이 될 수 있습니다. 무게는 2Kb에 불과합니다.

상록수
Segment.io의 UI 구성 요소 컬렉션입니다. 구성 요소는 매우 다양합니다. 단추, 아이콘, 텍스트 입력과 같은 일부 일반 구성 요소를 제외하고는 토스터, 사이드 시트 및 모서리 대화 상자와 같이 에버그린 만의 고유 한 기능이 몇 가지 있습니다..
