create-digigov-app 0.3.23 → 0.5.0

package/CHANGELOG.json

@@ -1,6 +1,67 @@
 {
   "name": "create-digigov-app",
   "entries": [
+    {
+      "version": "0.5.0",
+      "tag": "create-digigov-app_v0.5.0",
+      "date": "Thu, 30 Dec 2021 12:54:03 GMT",
+      "comments": {
+        "minor": [
+          {
+            "comment": "Update scaffolder's templates including @digigov/css configuration"
+          }
+        ]
+      }
+    },
+    {
+      "version": "0.4.1",
+      "tag": "create-digigov-app_v0.4.1",
+      "date": "Tue, 02 Nov 2021 13:03:39 GMT",
+      "comments": {
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@digigov/cli\" from `0.5.24` to `0.5.25`"
+          }
+        ]
+      }
+    },
+    {
+      "version": "0.4.0",
+      "tag": "create-digigov-app_v0.4.0",
+      "date": "Wed, 22 Sep 2021 10:15:42 GMT",
+      "comments": {
+        "minor": [
+          {
+            "comment": "create common layout component"
+          },
+          {
+            "comment": "Create a default `src/pages/404.js|ts` page when a new Digigov app codebase is generated from scratch"
+          }
+        ],
+        "patch": [
+          {
+            "comment": "Add README to the tool codebase"
+          }
+        ],
+        "dependency": [
+          {
+            "comment": "Updating dependency \"@digigov/cli-lint\" from `0.5.24` to `0.5.25`"
+          }
+        ]
+      }
+    },
+    {
+      "version": "0.3.24",
+      "tag": "create-digigov-app_v0.3.24",
+      "date": "Tue, 24 Aug 2021 13:55:40 GMT",
+      "comments": {
+        "patch": [
+          {
+            "comment": "Add digigovrc.js path to gitignore when a new Digigov Application is generated"
+          }
+        ]
+      }
+    },
     {
       "version": "0.3.23",
       "tag": "create-digigov-app_v0.3.23",

package/CHANGELOG.md

@@ -1,6 +1,37 @@
 # Change Log - create-digigov-app
 
-This log was last generated on Thu, 12 Aug 2021 08:56:35 GMT and should not be manually modified.
+This log was last generated on Thu, 30 Dec 2021 12:54:03 GMT and should not be manually modified.
+
+## 0.5.0
+Thu, 30 Dec 2021 12:54:03 GMT
+
+### Minor changes
+
+- Update scaffolder's templates including @digigov/css configuration
+
+## 0.4.1
+Tue, 02 Nov 2021 13:03:39 GMT
+
+_Version update only_
+
+## 0.4.0
+Wed, 22 Sep 2021 10:15:42 GMT
+
+### Minor changes
+
+- create common layout component
+- Create a default `src/pages/404.js|ts` page when a new Digigov app codebase is generated from scratch
+
+### Patches
+
+- Add README to the tool codebase
+
+## 0.3.24
+Tue, 24 Aug 2021 13:55:40 GMT
+
+### Patches
+
+- Add digigovrc.js path to gitignore when a new Digigov Application is generated
 
 ## 0.3.23
 Thu, 12 Aug 2021 08:56:35 GMT

package/README.md

@@ -0,0 +1,34 @@
+# create-digigov-app
+
+> `create-digigov-app` tool is a scaffolder CLI tool that helps devs to quickly
+> create new empty codebases without writing any code
+
+## How to run the scaffolder
+
+Create a new service app in a folder called `my-digigov-service`. The tool
+will ask you for a few options to customize the newly created codebase.
+
+```
+yarn create digigov-app my-digigov-service
+```
+
+or if you prefer to use `npx`
+
+```
+npx create-digigov-app my-digigov-service
+```
+
+## Test the scaffolder locally
+
+If you done some changes in the tool and you need to test that it works as
+expected, you can run the `cli.js` in your terminal as a node script and
+instruct the tool to create the new folder to the `/tmp` directory thus keeping
+the `digigov-sdk` repository clean.
+
+```
+node cli.js /tmp/test-service
+```
+
+After the script ends successfully, you can visit the `/tmp/test-service` and
+make sure that the files were generated as expected and run scripts like `yarn
+dev` and `yarn build` as in any other application.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-digigov-app",
-  "version": "0.3.23",
+  "version": "0.5.0",
   "description": "Create a DigiGOV App with ease",
   "bin": "cli.js",
   "files": [
@@ -25,8 +25,8 @@
     "validate-npm-package-name": "3.0.0"
   },
   "devDependencies": {
-    "@digigov/cli": "0.5.24",
-    "@digigov/cli-lint": "0.5.24",
+    "@digigov/cli": "0.5.25",
+    "@digigov/cli-lint": "0.5.25",
     "@digigov/cli-test": "0.5.24",
     "typescript": "4.2.3"
   },

package/saofile.js

@@ -2,17 +2,20 @@ const { relative } = require('path');
 const validate = require('validate-npm-package-name');
 
 const digigovDepsDev = [
-  "@digigov/cli",
-  "@digigov/cli-lint",
-  "@digigov/cli-app",
-  "@digigov/cli-build",
-  "@digigov/cli-test"
-]
+  '@digigov/cli',
+  '@digigov/cli-lint',
+  '@digigov/cli-app',
+  '@digigov/cli-build',
+  '@digigov/cli-test',
+];
 
 const digigovDeps = [
-  "@digigov/ui",
-  "@digigov/nextjs"
-]
+  '@digigov/ui',
+  '@digigov/nextjs',
+  '@digigov/react-core',
+  '@digigov/css',
+  'tailwindcss',
+];
 
 module.exports = {
   prompts: require('./prompts'),
@@ -58,8 +61,10 @@ module.exports = {
         '_package.json': 'package.json',
         '_.prettierrc.js': '.prettierrc.js',
         '_.eslintrc.js': '.eslintrc.js',
+        '_postcss.config.js': 'postcss.config.js',
+        '_tailwind.config.js': 'tailwind.config.js',
         '_tsconfig.json': 'tsconfig.json',
-        '_Dockerfile': 'Dockerfile',
+        _Dockerfile: 'Dockerfile',
       },
     });
 
@@ -74,13 +79,13 @@ module.exports = {
       await this.npmInstall({ npmClient: this.answers.pm });
       await this.npmInstall({
         npmClient: this.answers.pm,
-        packages: digigovDeps
-      })
+        packages: digigovDeps,
+      });
       await this.npmInstall({
         npmClient: this.answers.pm,
         packages: digigovDepsDev,
-        saveDev: true
-      })
+        saveDev: true,
+      });
     }
 
     const chalk = this.chalk;

package/template/_postcss.config.js

@@ -0,0 +1,3 @@
+// If you want to use other PostCSS plugins, see the following:
+// https://tailwindcss.com/docs/using-with-preprocessors
+module.exports = require('@digigov/cli-app/postcssrc')();

package/template/_tailwind.config.js

@@ -0,0 +1 @@
+module.exports = require('@digigov/cli-app/tailwindrc')();

package/template/gitignore

@@ -1,4 +1,5 @@
-# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring
+files.
 
 # dependencies
 /node_modules
@@ -23,3 +24,6 @@
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
+
+# ignore development specific digigov files
+digigovrc.js

package/template/javascript/base.css

@@ -0,0 +1,4 @@
+@tailwind base;
+@layer base {
+  @import "@digigov/css/src/base/base.css";
+};

package/template/javascript/components.css

@@ -0,0 +1,15 @@
+@tailwind components;
+@layer components {
+  @import "@digigov/css/src/components/accordion.css";
+  @import "@digigov/css/src/components/button.css";
+  @import "@digigov/css/src/components/components.css";
+  @import "@digigov/css/src/components/form.css";
+  @import "@digigov/css/src/components/checkboxes.css";
+  @import "@digigov/css/src/components/radios.css";
+  @import "@digigov/css/src/components/general.css";
+  @import "@digigov/css/src/components/header.css";
+  @import "@digigov/css/src/components/footer.css";
+  @import "@digigov/css/src/components/layout.css";
+  @import "@digigov/css/src/components/nav.css";
+  @import "@digigov/css/src/components/typography.css";
+};

package/template/javascript/index.css

@@ -0,0 +1,4 @@
+
+@import "./base.css";
+@import "./components.css";
+@import './utilities.css';

package/template/javascript/src/components/Layout.js

@@ -0,0 +1,42 @@
+import React from 'react';
+import Head from 'next/head';
+import { useTranslation } from '@digigov/ui/app/i18n';
+
+import BasicLayout, {
+  Top,
+  Content,
+  Bottom,
+} from '@digigov/ui/layouts/Basic';
+import Header /* , { HeaderTitle } */ from '@digigov/ui/app/Header';
+/* import ServiceBadge from '@digigov/ui/core/ServiceBadge'; */
+import GovGRLogo from '@digigov/ui/govgr/Logo';
+import GovGRFooter from '@digigov/ui/govgr/Footer';
+
+const Layout = ({ children }) => {
+  const { t } = useTranslation();
+  return (
+    <BasicLayout>
+      <Head>
+        <title>{t('app.name')}</title>
+      </Head>
+      <Top>
+        <Header>
+          <GovGRLogo />
+          {/* Use the HeaderTitle with a service name if your service is more than 5 pages long - this can help users understand which service they are using. */}
+          {/* <HeaderTitle>
+            {t('app.name')}
+            <ServiceBadge label="ALPHA" />
+          </HeaderTitle> */}
+        </Header>
+      </Top>
+      <Content>
+        {children}
+      </Content>
+      <Bottom>
+        <GovGRFooter />
+      </Bottom>
+    </BasicLayout>
+  );
+};
+
+export default Layout;

package/template/javascript/src/locales/en.js

@@ -5,4 +5,4 @@ export default {
     intro_text: 'Welcome to My Service',
   },
   ...defaultEn,
-};
+};

package/template/javascript/src/pages/404.js

@@ -0,0 +1,17 @@
+import React from 'react';
+import NotFound from '@digigov/ui/app/NotFound';
+import { Main, Side } from '@digigov/ui/layouts/Basic';
+import Layout from '<%= name %>/components/Layout';
+
+const NotFoundPage = () => {
+  return (
+    <Layout>
+      <Main>
+        <NotFound />
+      </Main>
+      <Side></Side>
+    </Layout>
+  );
+};
+
+export default NotFoundPage;

package/template/javascript/src/pages/_app.js

@@ -1,7 +1,9 @@
 import App from '@digigov/nextjs/App';
 import initI18n from '@digigov/nextjs/i18n';
-import el from '../locales/el';
-import en from '../locales/en';
+import el from '<%= name %>/locales/el';
+import en from '<%= name %>/locales/en';
+import 'tailwindcss/tailwind.css';
+import '../../index.css';
 
 initI18n({
   el: {

package/template/javascript/src/pages/index.js

@@ -1,49 +1,24 @@
 import React from 'react';
-import Head from 'next/head';
 import { useTranslation } from '@digigov/ui/app/i18n';
-
-import BasicLayout, {
-  Top,
-  Content,
-  Main,
-  Side,
-  Bottom,
-} from '@digigov/ui/layouts/Basic';
-import Header, { HeaderTitle } from '@digigov/ui/app/Header';
-import ServiceBadge from '@digigov/ui/core/ServiceBadge';
-import GovGRLogo from '@digigov/ui/govgr/Logo';
-import GovGRFooter from '@digigov/ui/govgr/Footer';
+import { Main, Side } from '@digigov/ui/layouts/Basic';
 import PageTitle, { PageTitleHeading } from '@digigov/ui/app/PageTitle';
+import CallToAction from '@digigov/ui/core/Button/CallToAction';
+import Paragraph from '@digigov/ui/typography/Paragraph';
+import Layout from '<%= name %>/components/Layout';
 
 const Home = () => {
   const { t } = useTranslation();
   return (
-    <BasicLayout>
-      <Head>
-        <title>{t('app.name')}</title>
-      </Head>
-      <Top>
-        <Header>
-          <GovGRLogo />
-          <HeaderTitle>
-            {t('app.name')}
-            <ServiceBadge label="ALPHA" />
-          </HeaderTitle>
-        </Header>
-      </Top>
-      <Content>
-        <Main>
-          <PageTitle>
-            <PageTitleHeading>{t('app.name')}</PageTitleHeading>
-          </PageTitle>
-          <div>{t('app.intro_text')}</div>
-        </Main>
-        <Side></Side>
-      </Content>
-      <Bottom>
-        <GovGRFooter />
-      </Bottom>
-    </BasicLayout>
+    <Layout>
+      <Main>
+        <PageTitle>
+          <PageTitleHeading>{t('app.name')}</PageTitleHeading>
+        </PageTitle>
+        <Paragraph>{t('app.intro_text')}</Paragraph>
+        <CallToAction href="/login">{t('button.start')}</CallToAction>
+      </Main>
+      <Side></Side>
+    </Layout>
   );
 };
 

package/template/javascript/utilities.css

@@ -0,0 +1,4 @@
+@tailwind utilities;
+@layer utilities {
+  @import "@digigov/css/src/utilities/utilities.css";
+};

package/template/typescript/src/components/Layout.tsx

@@ -0,0 +1,42 @@
+import React from 'react';
+import Head from 'next/head';
+import { useTranslation } from '@digigov/ui/app/i18n';
+
+import BasicLayout, {
+  Top,
+  Content,
+  Bottom,
+} from '@digigov/ui/layouts/Basic';
+import Header /* , { HeaderTitle } */ from '@digigov/ui/app/Header';
+/* import ServiceBadge from '@digigov/ui/core/ServiceBadge'; */
+import GovGRLogo from '@digigov/ui/govgr/Logo';
+import GovGRFooter from '@digigov/ui/govgr/Footer';
+
+const Layout: React.FC = ({ children }) => {
+  const { t } = useTranslation();
+  return (
+    <BasicLayout>
+      <Head>
+        <title>{t('app.name')}</title>
+      </Head>
+      <Top>
+        <Header>
+          <GovGRLogo />
+          {/* Use the HeaderTitle with a service name if your service is more than 5 pages long - this can help users understand which service they are using. */}
+          {/* <HeaderTitle>
+            {t('app.name')}
+            <ServiceBadge label="ALPHA" />
+          </HeaderTitle> */}
+        </Header>
+      </Top>
+      <Content>
+        {children}
+      </Content>
+      <Bottom>
+        <GovGRFooter />
+      </Bottom>
+    </BasicLayout>
+  );
+};
+
+export default Layout;

package/template/typescript/src/pages/404.tsx

@@ -0,0 +1,18 @@
+import React from 'react';
+import NotFound from '@digigov/ui/app/NotFound';
+import { Main, Side } from '@digigov/ui/layouts/Basic';
+import Layout from '<%= name %>/components/Layout';
+
+const NotFoundPage: React.FC = () => {
+  return (
+    <Layout>
+      <Main>
+        <NotFound />
+      </Main>
+      <Side></Side>
+    </Layout>
+  );
+};
+
+export default NotFoundPage;
+

package/template/typescript/src/pages/_app.tsx

@@ -1,7 +1,9 @@
 import App from '@digigov/nextjs/App';
 import initI18n from '@digigov/nextjs/i18n';
-import el from '../locales/el';
-import en from '../locales/en';
+import el from '<%= name %>/locales/el';
+import en from '<%= name %>/locales/en';
+import 'tailwindcss/tailwind.css';
+import '../../index.css';
 
 initI18n({
   el: {

package/template/typescript/src/pages/index.tsx

@@ -1,49 +1,24 @@
 import React from 'react';
-import Head from 'next/head';
 import { useTranslation } from '@digigov/ui/app/i18n';
-
-import BasicLayout, {
-  Top,
-  Content,
-  Main,
-  Side,
-  Bottom,
-} from '@digigov/ui/layouts/Basic';
-import Header, { HeaderTitle } from '@digigov/ui/app/Header';
-import ServiceBadge from '@digigov/ui/core/ServiceBadge';
-import GovGRLogo from '@digigov/ui/govgr/Logo';
-import GovGRFooter from '@digigov/ui/govgr/Footer';
+import { Main, Side } from '@digigov/ui/layouts/Basic';
 import PageTitle, { PageTitleHeading } from '@digigov/ui/app/PageTitle';
+import CallToAction from '@digigov/ui/core/Button/CallToAction';
+import Paragraph from '@digigov/ui/typography/Paragraph';
+import Layout from '<%= name %>/components/Layout';
 
 const Home: React.FC = () => {
   const { t } = useTranslation();
   return (
-    <BasicLayout>
-      <Head>
-        <title>{t('app.name')}</title>
-      </Head>
-      <Top>
-        <Header>
-          <GovGRLogo />
-          <HeaderTitle>
-            {t('app.name')}
-            <ServiceBadge label="ALPHA" />
-          </HeaderTitle>
-        </Header>
-      </Top>
-      <Content>
-        <Main>
-          <PageTitle>
-            <PageTitleHeading>{t('app.name')}</PageTitleHeading>
-          </PageTitle>
-          <div>{t('app.intro_text')}</div>
-        </Main>
-        <Side></Side>
-      </Content>
-      <Bottom>
-        <GovGRFooter />
-      </Bottom>
-    </BasicLayout>
+    <Layout>
+      <Main>
+        <PageTitle>
+          <PageTitleHeading>{t('app.name')}</PageTitleHeading>
+        </PageTitle>
+        <Paragraph>{t('app.intro_text')}</Paragraph>
+        <CallToAction href="/login">{t('button.start')}</CallToAction>
+      </Main>
+      <Side></Side>
+    </Layout>
   );
 };