CSS 데이터베이스 쿼리? 물론 우리는 할 수 있습니다!

조금 웃긴 것 같네요? CSS 데이터베이스 쿼리. 그러나 CSS는 다른 언어가 읽을 수있는 것들의 가치를 설정하기 때문에 다른 언어와 의사 소통 할 수 있습니다. 또한 CSS는 다른 파일을 요청할 수 있으며 서버가 데이터베이스에서 요청한 내용으로 요청에 응답 할 수 있다고 생각합니다.

그러나 나는 약간의 주제를 벗어났다. CSS 데이터베이스 쿼리에 대한 아이디어는 다른 날 CSS를 사용하여 데이터베이스에 연결할 수있는 개발자를 찾고있는 채용 담당자에 대한 농담 트윗이었습니다. Lee Meichin은 다음과 같이 썼습니다. "예, CSS와 데이터베이스에 연결할 수 있습니다"는 똑같이 재미있는 응답입니다.

CSS 데이터베이스 쿼리의 기술은 무엇입니까?

꽤 영리합니다 :

1. ESM으로 수동으로 수정 된 SQL.JS를 사용하여 JavaScript의 SQLITE입니다.
2. sql.js가 쿼리 할 수있는 데이터베이스를 준비하십시오.
3. JavaScript에서 쿼리를 실행하는 Houdini Paintworklet을 구축하고 Paintworklet의 결과를 초래합니다.<canvas></canvas> 화면으로 다시 그립니다.
4. CSS 사용자 정의 속성을 통해 쿼리를 작업자로 전달하십시오.

따라서 최종 사용량은 다음과 같습니다.

 css.paintworklet.addmodule ( './ cssdb.js')

기본 {
  -SQL-Query : 테스트에서 이름을 선택하십시오.
  배경 : 페인트 (SQL-DB);
}

CSS의 데이터베이스를 연결하고 쿼리하고 있음을 인정해야합니다.

작년에 Simon Willison이 작년에 완전히 다른 방식으로하는 것을 상기시켜줍니다. 그의 개념은 JSON 데이터를 반환하는 /api/roadside_attractions 와 같은 편안한 엔드 포인트를 가지고 있다는 것입니다. 그러나 대체 엔드 포인트로서, 모든 데이터가 CSS 사용자 정의 속성으로 사용되는 유효한 CSS 파일을 반환하는 /api/roadside_attractions.css 로 설정할 수 있습니다.

따라서 다음과 같이 보입니다.

<link href="/api/roadside_attractions.css" rel="stylesheet">
.attraction-name : {content : var (-name)};
.attraction-address : {content : var (-주소);
<p>명소 이름 :</p>
<p>주소:</p>

다시 말하지만, 이것은 본질적으로 CSS의 데이터베이스에 연결됩니다 (HTML이 필요하지만). 당신은 그것이 어떻게 작동하는지 직접 볼 수 있습니다.

위 내용은 CSS 데이터베이스 쿼리? 물론 우리는 할 수 있습니다!의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!