In this recipe, you will work with re-usable components to generate a home page containing three sections: a header, a paragraph with a description, and a footer. These three sections will be written as three separate components that will be composed later to build a home page. Before you start, create a new package.json file with the following content:
{ "scripts": { "start": "parcel serve -p 1337 index.html" }, "devDependencies": { "babel-plugin-transform-class-properties": "6.24.1", "babel-preset-env": "1.6.1", "babel-preset-react": "6.24.1", "babel-core": "6.26.3", "parcel-bundler": "1.8.1", "react": "16.3.2", "react-dom": "16.3.2" } }
Next, create a babel configuration file as .babelrc, adding the following content:
{ "presets": ["env","react"], "plugins": ["transform-class-properties"] }
Then, install the dependencies by opening a Terminal and running:
npm install