SFS (Semantic Faceted Search) is a library for implementing semantic faceted search in modern web applications.
If you want to use SFS in a React app, check out react-sfs.
Install via yarn add sfs-api
or npm install sfs-api
.
First you need to define facets which you want to use. At this moment only 2 facet types are supported - CheckboxFacet and SelectFacet. However, you can implement your own facet by extending abstract Facet class.
Example facets:
export const nationalityFacet = new SelectFacet({
id: "nationality",
predicate: "dbp:nationality",
labelPredicates: ["rdfs:label"],
});
export const birthPlaceFacet = new CheckboxFacet({
id: "birthPlace",
predicate: "dbp:birthPlace",
labelPredicates: ["rdfs:label", "skos:prefLabel"],
});
Class for interacting with facet search is SfsApi.
IMPORTANT: baseQuery has to return _id and _label variable.
More about configuration properties can be found in SfsApi documentation.
Example configuration:
const language = "en";
export const sfsApiDbpedia = new SfsApi({
endpointUrl: "https://dbpedia.org/sparql",
facets: [nationalityFacet, birthPlaceFacet],
baseQuery:
`SELECT DISTINCT ?_id ?_label
WHERE
{ ?_id a dbo:Writer .
FILTER isIRI(?_id)
OPTIONAL
{ ?_id rdfs:label ?rdfsLabel
FILTER langMatches(lang(?rdfsLabel), "${language}")
}
OPTIONAL
{ ?_id skos:prefLabel ?prefLabel
FILTER langMatches(lang(?prefLabel), "${language}")
}
BIND(coalesce(?rdfsLabel, ?prefLabel, ?_id) AS ?_label)
}
ORDER BY ASC(?_label)`,
language,
prefixes: {
rdfs: "http://www.w3.org/2000/01/rdf-schema#",
skos: "http://www.w3.org/2004/02/skos/core#",
dbp: "http://dbpedia.org/property/",
dbo: "http://dbpedia.org/ontology/",
},
});
SfsApi and Facets emit Events. You can subscribe to these events and update your UI according to them.
Check out React demo with the use of react-sfs.
Generated using TypeDoc