{"id":15313567,"url":"https://github.com/lortschi/vm-meteor-react-boilerplate","last_synced_at":"2026-04-10T02:52:30.560Z","repository":{"id":234538835,"uuid":"280759681","full_name":"lortschi/vm-meteor-react-boilerplate","owner":"lortschi","description":"vm-meteor-react-boilerplate","archived":false,"fork":false,"pushed_at":"2020-07-18T23:57:33.000Z","size":1463,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-02-01T18:43:21.350Z","etag":null,"topics":["admin-area","authorization","boilerplate","eslint","i18n","languag-switche","meteor","meteor-react","meteorjs","nodejs","reactjs","sass","scss","semantic-ui","starter","usermanagement"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/lortschi.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2020-07-18T23:53:26.000Z","updated_at":"2020-07-19T00:05:17.000Z","dependencies_parsed_at":"2024-04-19T19:01:33.931Z","dependency_job_id":"b8fe86e5-fce2-404d-9188-b2381130f4a7","html_url":"https://github.com/lortschi/vm-meteor-react-boilerplate","commit_stats":null,"previous_names":["lortschi/vm-meteor-react-boilerplate"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lortschi%2Fvm-meteor-react-boilerplate","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lortschi%2Fvm-meteor-react-boilerplate/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lortschi%2Fvm-meteor-react-boilerplate/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lortschi%2Fvm-meteor-react-boilerplate/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/lortschi","download_url":"https://codeload.github.com/lortschi/vm-meteor-react-boilerplate/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245863030,"owners_count":20684774,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["admin-area","authorization","boilerplate","eslint","i18n","languag-switche","meteor","meteor-react","meteorjs","nodejs","reactjs","sass","scss","semantic-ui","starter","usermanagement"],"created_at":"2024-10-01T08:42:18.837Z","updated_at":"2025-10-17T18:19:23.723Z","avatar_url":"https://github.com/lortschi.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"Meteor React Semantic-UI Progressive WebApp Boilerplate is a sample Meteor 1.9 application that illustrates:\n\n  * A standard directory layout using 'imports/' as recommended in the [Meteor Guide](https://guide.meteor.com/structure.html)\n  * [Semantic UI React](https://react.semantic-ui.com/) for user interface.\n  * [SCSS Preprocessor](https://github.com/Meteor-Community-Packages/meteor-scss) based on fourseven:scss.\n  * [Meteor-Universe-i18n ](https://github.com/vazco/meteor-universe-i18n) internationalization language package.\n  * [Uniforms](https://uniforms.tools/) for form development.\n  * [alanning:roles](https://github.com/alanning/meteor-roles) to implement a special \"Admin\" user.\n  * Authorization, authentication, and registration using built-in Meteor packages.\n  * Initialization of users and data from a settings file.\n  * Alerts regarding success or failure of DB updates using [Sweet Alert](https://sweetalert.js.org/).\n  * Quality assurance using [ESLint](http://eslint.org) with packages to partially enforce the [Meteor Coding Standards](https://guide.meteor.com/code-style.html) and the [AirBnB Javascript Style Guide](https://github.com/airbnb/javascript).\n  * Responsive mobile ready.\n\nThe goal of this template is to help you get quickly started doing Meteor development by providing a reasonable directory structure for development and deployment, a set of common extensions to the core framework, and boilerplate code to implement basic page display, navigation, forms, roles, and collection manipulation.\n\n## Installation\n\nInstall first the Meteor Framework, [install Meteor](https://www.meteor.com/install).\n\nCd into the app/ directory of your local copy of the repo, and install third party libraries with:\n\n```\n$ meteor npm install\n```\n\n## Running the system\n\nOnce the libraries are installed, you can run the application by invoking the \"start\" script in the [package.json file](https://github.com/lortschi/vm-meteor-react-boilerplate/blob/master/app/package.json):\n\n```\n$ meteor npm run start\n```\n\nThe first time you run the app, it will create some default users and data. Here is the output:\n\n```\nmeteor npm run start\n\n\u003e vm-meteor-react-boilerplate$\n\n[[[[[ ~/github/lortschi/vm-meteor-react-boilerplate/app ]]]]]\n\n=\u003e Started proxy.\n=\u003e Started MongoDB.\nI20180227-13:33:02.716(-10)? Creating the default user(s)\nI20180227-13:33:02.742(-10)?   Creating user admin@foo.com.\nI20180227-13:33:02.743(-10)?   Creating user john@foo.com.\nI20180227-13:33:02.743(-10)? Creating default data.\nI20180227-13:33:02.743(-10)?   Adding: Basket (john@foo.com)\nI20180227-13:33:02.743(-10)?   Adding: Bicycle (john@foo.com)\nI20180227-13:33:02.743(-10)?   Adding: Banana (admin@foo.com)\nI20180227-13:33:02.744(-10)?   Adding: Boogie Board (admin@foo.com)\n=\u003e Started your app.\n\n=\u003e App running at: http://localhost:3000/\n```\n\n\n### Note regarding \"bcrypt warning\":\n\nYou will also get the following message when you run this application:\n\n```\nNote: you are using a pure-JavaScript implementation of bcrypt.\nWhile this implementation will work correctly, it is known to be\napproximately three times slower than the native implementation.\nIn order to use the native implementation instead, run\n\n  meteor npm install --save bcrypt\n\nin the root directory of your application.\n```\n\nOn some operating systems (particularly Windows), installing bcrypt is much more difficult than implied by the above message. Bcrypt is only used in Meteor for password checking, so the performance implications are negligible until your site has very high traffic. You can safely ignore this warning without any problems during initial stages of development.\n\n### Note regarding \"MongoError: not master and slaveOk=false\":\n\nIntermittently, you may see the following error message in the console when the system starts up:\n\n```\nMongoError: not master and slaveOk=false\n     at queryCallback (/Users/lortschi/.meteor/packages/npm-mongo/.3.1.1.1mmptof.qcqo++os+web.browser+web.browser.legacy+web.cordova/npm/node_modules/mongodb-core/lib/cursor.js:248:25)\n     at /Users/lortschi/.meteor/packages/npm-mongo/.3.1.1.1mmptof.qcqo++os+web.browser+web.browser.legacy+web.cordova/npm/node_modules/mongodb-core/lib/connection/pool.js:532:18\n     at _combinedTickCallback (internal/process/next_tick.js:131:7)\n     at process._tickDomainCallback (internal/process/next_tick.js:218:9)\n```\n\nWhile irritating, this message appears to be harmless and [possibly related to a race condition between the development instance of Mongo and Meteor](https://github.com/meteor/meteor/issues/9026#issuecomment-330850366). By harmless, I mean that in most cases, the console goes on to display `App running at: http://localhost:3000/` and no problems occur during run time.\n\n### Viewing the running app\n\nIf all goes well, the template application will appear at [http://localhost:3000](http://localhost:3000).  You can login using the credentials in [settings.development.json](https://github.com/lortschi/vm-meteor-react-boilerplate/blob/master/config/settings.development.json), or else register a new account.\n\n### ESLint\n\nYou can verify that the code obeys our coding standards by running ESLint over the code in the imports/ directory with:\n\n```\nmeteor npm run lint\n```\n\n### Directory structure\n\nThe top-level directory structure is:\n\n```\napp/        # holds the Meteor application sources\nconfig/     # holds configuration files, such as settings.development.json\ndoc/        # holds developer documentation, user guides, etc.\n```\n\nThis structure separates documentation files (such as screenshots) and configuration files (such as the settings files) from the actual Meteor application.\n\nThe app/ directory has this structure:\n\n```\nclient/\n  main.html      # The boilerplate HTML with a \"root\" div to be manipulated by React.\n  main.js        # import startup files.\n\nimports/\n  api/           # Define collections\n    stuff/       # The Stuff collection definition\n  startup/       # Define code to run when system starts up (client-only, server-only, both)\n    client/\n    server/\n  ui/\n    layouts/     # Contains top-level layout (\u003cApp\u003e component).\n    pages/       # Contains components for each page.\n    components/  # Contains page elements, some of which could appear on multiple pages.\n\nnode_modules/    # managed by npm\n\npublic/          # static assets (like images) can go here.\n\nserver/\n   main.js       # import the server-side js files.\n```\n\n### Import conventions\n\nThis system adheres to the Meteor guideline of putting all application code in the imports/ directory, and using client/main.js and server/main.js to import the code appropriate for the client and server in an appropriate order.\n\n### Application functionality\n\nThe application implements a simple CRUD application for managing \"Stuff\", which is a Mongo Collection consisting of a name (String), a quantity (Number), and a condition (one of 'excellent', 'good', 'fair', or 'poor').\n\nBy default, each user only sees the Stuff that they have created.  However, the settings file enables you to define default accounts.  If you define a user with the role \"admin\", then that user gets access to a special page which lists all the Stuff defined by all users.\n\n### Component UI Styles and Theming\n\nThe application uses the [React implementation of Semantic UI](http://react.semantic-ui.com/) and theming.\n\n### SCSS / CSS\n\nThe style.scss allows to overwrite the default theme styles or create new ones.\n\n### Routing\n\nFor display and navigation among its four pages, the application uses [React Router](https://reacttraining.com/react-router/).\n\nRouting is defined in [imports/ui/layouts/App.jsx](https://github.com/lortschi/vm-meteor-react-boilerplate/blob/master/app/imports/ui/layouts/App.jsx).\n\n\n### Authentication\n\nFor authentication, the application uses the Meteor accounts package.\n\nWhen the application is run for the first time, a settings file (such as [config/settings.development.json](https://github.com/lortschi/vm-meteor-react-boilerplate/blob/master/config/settings.development.json)) should be passed to Meteor. That will lead to a default account being created through the code in [imports/startup/server/accounts.js](https://github.com/lortschi/vm-meteor-react-boilerplate/blob/master/app/imports/startup/server/accounts.js).\n\nThe application allows users to register and create new accounts at any time.\n\n### Authorization\n\nOnly logged in users can manipulate Stuff documents (but any registered user can manipulate any Stuff document, even if they weren't the user that created it.)\n\n### Configuration\n\nThe [config](https://github.com/lortschi/vm-meteor-react-boilerplate/tree/master/config) directory is intended to hold settings files.  The repository contains one file: [config/settings.development.json](https://github.com/lortschi/vm-meteor-react-boilerplate/blob/master/config/settings.development.json).\n\nThe [.gitignore](https://github.com/lortschi/vm-meteor-react-boilerplate/blob/master/.gitignore) file prevents a file named settings.production.json from being committed to the repository. So, if you are deploying the application, you can put settings in a file named settings.production.json and it will not be committed.\n\n### Quality Assurance\n\n#### ESLint\n\nThe application includes a [.eslintrc](https://github.com/lortschi/vm-meteor-react-boilerplate/blob/master/app/.eslintrc) file to define the coding style adhered to in this application. You can invoke ESLint from the command line as follows:\n\n```\n[~/vm-meteor-react-boilerplate/app]-\u003e meteor npm run lint\n\n\u003e vm-meteor-react-boilerplate@ lint /Users/lortschi/meteor-application-template-react/app\n\u003e eslint --quiet ./imports\n```\n\nESLint should run without generating any errors.\n\n### Screencasts of the GUI\n!['home'](app/public/themes/default/assets/images/home_screenshot.png)\n!['home-lang'](app/public/themes/default/assets/images/home-lang_screenshot.png)\n!['login'](app/public/themes/default/assets/images/login_screenshot.png)\n!['mobile'](app/public/themes/default/assets/images/mobile-login_screenshot.png)  \n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flortschi%2Fvm-meteor-react-boilerplate","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flortschi%2Fvm-meteor-react-boilerplate","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flortschi%2Fvm-meteor-react-boilerplate/lists"}