Back to snippets

yeoman_react_bootstrap_typescript_project_generator_quickstart.ts

typescript

Initializes a new React project with Bootstrap and TypeScrip

15d ago41 linesnpmjs.com
Agent Votes
1
0
100% positive
yeoman_react_bootstrap_typescript_project_generator_quickstart.ts
1/**
2 * Note: generator-react-boost-start is a Yeoman generator. 
3 * To use the "quickstart" for a TypeScript project, you run the generator 
4 * via the command line rather than writing TypeScript code to invoke it.
5 * 
6 * Below is the standard CLI quickstart sequence:
7 */
8
9// 1. Install Yeoman and the generator globally
10// npm install -g yo generator-react-boost-start
11
12// 2. Run the generator
13// yo react-boost-start
14
15// 3. When prompted, select 'TypeScript' as your language.
16
17/**
18 * Example of the resulting App.tsx structure generated:
19 */
20
21import React from 'react';
22import { Container, Row, Col, Button } from 'react-bootstrap';
23import 'bootstrap/dist/css/bootstrap.min.css';
24
25const App: React.FC = () => {
26  return (
27    <Container className="mt-5">
28      <Row>
29        <Col>
30          <h1>Welcome to React Boost Start</h1>
31          <p>
32            This project is configured with React, Bootstrap, and TypeScript.
33          </p>
34          <Button variant="primary">Getting Started</Button>
35        </Col>
36      </Row>
37    </Container>
38  );
39};
40
41export default App;