1.0.1 • Public • Published

    Create a Synxty App

    Start your projects like a pro

    Table of Contents

    📃 Why?


    ✅ TypeScript is default
    ✅ Next.js because SEO is essential and SSR is included
    ✅ styled-components, write CSS with JS? Thanks
    ✅ Jest, the only library you need to test your app behavior
    ✅ Your code will always be beautiful with Prettier
    ✅ ESLint to keep a code pattern between the team
    ✅ lint-staged to assure that every code gets linted when committed
    ✅ Your commits will be meaningful with commitizen and commitlint
    ✅ A complete README file, every project deserves one

    Overall, creating a project with create-synxty-app is as easy as create-react-app or create-next-app but it sets you and your team ready to develop with a much better experience.

    🎨 Creating a Project

    Using npm, run the following command:

    npx create-synxty-app my-app

    or, using yarn:

    yarn create synxty-app my-app

    Note: Since you're probably going to run this commands in a full stack application, if you don't specify the name of the project it defaults to web.

    And that's it!

    📁 Folder Structure

    After the installation completes, a new directory is created with the name of your app. This is the structure that you get inside your project:

    ├── node_modules/
    ├── package.json
    ├── .gitignore
    ├── .eslintrc.json
    ├── .eslintignore
    ├── tsconfig.json
    ├── commitlint.config.js
    ├── .babelrc
    ├── setupTests.js
    ├── jest.config.js
    ├── next-env.d.ts
    ├── next.config.js
    ├── .prettierrc
    ├── .github/
    │   └── assets/
    │       └── banner.png
    ├── public/
    │   ├── favicon.ico
    │   └── synxty.svg
    └── src/
        ├── layouts/
        │   ├── Home/
        │   │    ├── index.tsx
        │   │    ├── index.spec.tsx
        │   │    └── styles.ts
        ├── pages/
        │   ├── _app.tsx
        │   ├── _document.tsx
        │   └── index.tsx
        └── styles/
            └── global.ts

    ▶️ Available Scripts Within the Created Project

    npm run dev or yarn dev

    Runs the app in development mode.
    Open http://localhost:3000 to view it in the browser.
    The page will reload if you make edits.
    You will also see any lint errors in the console.

    npm run test or yarn test

    Launches the test runner.

    npm run build or yarn build

    Builds the app for production to the build folder.
    It correctly bundles React in production mode and optimizes the build for the best performance.
    The build is minified and the filenames include the hashes.

    npm start or yarn start

    Runs the app in production.

    🧠 Learn More

    To learn React, check out the React documentation.
    To learn Next.js, check out the Next.js documentation.
    To learn styled-components, checkout the styled-components documentation.

    ⚖️ License

    This template is open source software licensed as MIT.

    Thank you, made with 💗 by Synxty.


    npm i create-synxty-app

    DownloadsWeekly Downloads






    Unpacked Size

    542 kB

    Total Files


    Last publish


    • tiddal