History

Hugo Bernier 103907bdc6 Added compatibility warning on readme and template		2023-02-10 10:22:32 -05:00
..
.devcontainer	Added 1.8.2 containers	2022-02-16 00:00:27 -05:00
assets	Changed docs links to learn	2022-10-24 09:42:45 -04:00
config	fix limit 100 items	2020-10-30 22:08:00 +01:00
src	fix limit 100 items	2020-10-30 22:08:00 +01:00
teams	Added a new sample react-faq app	2020-04-25 23:46:39 -07:00
.editorconfig	Added a new sample react-faq app	2020-04-25 23:46:39 -07:00
.gitignore	Added a new sample react-faq app	2020-04-25 23:46:39 -07:00
.yo-rc.json	Added a new sample react-faq app	2020-04-25 23:46:39 -07:00
README.md	Added compatibility warning on readme and template	2023-02-10 10:22:32 -05:00
gulpfile.js	Added a new sample react-faq app	2020-04-25 23:46:39 -07:00
package-lock.json	Added a new sample react-faq app	2020-04-25 23:46:39 -07:00
package.json	Added a new sample react-faq app	2020-04-25 23:46:39 -07:00
tsconfig.json	Added a new sample react-faq app	2020-04-25 23:46:39 -07:00
tslint.json	Added a new sample react-faq app	2020-04-25 23:46:39 -07:00

README.md

page_type

products

languages

extensions

sample

office-sp

javascript

typescript

contentType

technologies

platforms

createdDate

samples

SharePoint Framework

react

04/25/2017 12:00:00 AM

Frequently Asked Questions App

Summary

This Web Part allows users to create Frequently Asked Questions(Faq App) in modern and classic SharePoint pages.
This web part allows to search within questions and answers which are stored in a SharePoint FAQ list.
"React-autosuggest and react-accessible-accordion" react packages are used for the search and accordion control.

Compatibility

⚠️ Important
Every SPFx version is only compatible with specific version(s) of Node.js. In order to be able to build this sample, please ensure that the version of Node on your workstation matches one of the versions listed in this section. This sample will not work on a different version of Node.
Refer to https://aka.ms/spfx-matrix for more information on SPFx compatibility.

Applies to

Solution

Solution	Author(s)
react-FAQApp	Ashok Swain - LinkedIn: https://www.linkedin.com/in/ashok-kumar-swain-2627a514
react-FAQApp	Abderahman Moujahid

Version history

Version	Date	Comments
1.0.0	April 25, 2020	Initial release
1.0.1	October 30, 2020	Fix limit 100 items

Disclaimer

THIS CODE IS PROVIDED AS IS WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.

Minimal Path to Awesome

git clone the repo
npm i
npm i -g gulp
gulp serve

This sample can also be opened with VS Code Remote Development. Visit https://aka.ms/spfx-devcontainer for further instructions.

Local Mode

A browser in local mode (localhost) will be opened. https://localhost:4321/temp/workbench.html

SharePoint Mode

If you want to try on a real environment, open: https://[your-domain].sharepoint.com/_layouts/15/workbench.aspx

Usage

Create a FAQ List in SharePoint.
Create the below fields:
Title field can be considered as "Question" field.

Column Name	Field Type
`Title`	Single line of text
`Answer`	Multiple lines of text
`Category`	Single line of text
`CategorySortOrder`	Number
`QuestionSortOrder`	Number

Edit the web part, set the ListName in the property pane

Features

This Web Part allows users to create Frequently Asked Questions(FAQ App) in modern and classic SharePoint pages.
An accordion layout is used to make it easy to browse through different questions.
Expand answers to your most frequent questions.
Include text, links, images in your answers.
A search bar to make your FAQ accordion searchable.
This web part allows to search within questions and answers which are stored in a SharePoint FAQ list.
Sorting is enabled on both the category & Question