Skip to content

devmohamedkh/mern-snippets

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

21 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

If some snippets do not show up, add the following to your settings file

    "configurationDefaults": {
        "files.associations": {
            "*.ejs": "html"
        },
        "emmet.includeLanguages": {
            "ejs": "html"
        }
    }

or you can dowinlode mern-snippets-0.0.1.vsix frome : https://github.com/moh2medkhaled/mern-snippets/blob/master/mern-snippets-0.0.1.vsix

This problem occurs because vs code deletes this command frome package.json. This problem may appear when using EJS - HBS - MongoDB snippets

Express Snippets

Prefix Method
app.get Express GET request
app.post Express POST request
app.put Express PUT request
app.delete Express DELETE request
app.all This method is like the standard app.METHOD() methods, except it matches all HTTP verbs.
app.disable Sets the Boolean setting name to false, where name is one of the properties from the app settings table.
app.disabled Returns true if the Boolean setting name is disabled (false), where name is one of the properties from the app settings table.
app.set Assigns setting name to value, where name is one of the properties from the app settings table."
app.use Mounts the specified middleware function or functions at the specified path. If path is not specified.
app.listen Binds and listens for connections on the specified host and port. This method is identical to Node's http.Server.listen().
app.render Returns the rendered HTML of a view via the callback function. It accepts an optional parameter that is an object containing local variables for the view.
app.param Add callback triggers to route parameters, where name is the name of the parameter or an array of them, and callback is the callback function.
app.patch Routes HTTP PATCH request to the specifed path with the specified callback functions.
app.route Returns an instance of a single route, which you can then use to handle HTTP verbs with optional middleware. Use app.route() to avoid duplicate route names (and thus typo errors).
res.send Express RESPONSE object

express function

Prefix Method
jwt.creat to creat jsonwebtoken
jwt.verify to verify jsonwebtoken
json.successResponse api json success Response
json.errorResponse api json Error Response
error-class Error handler class helper with example
nodeMailer node mailer for sending email massage
session-with-mongo-store session with mongoDB store
multer.mi node mailer for sending multiple image
multer.si node mailer for sending singlr image
joiV joi Validation
auth-mid To confirm whether it is login or not
e-controller express controller

JavaScript Snippets

Prefix Method
af Arrow Function
.filter Filter Function
.find Find Function
.findIndex findIndex Function
.indexOf indexOf Function
.map map Function
.sort sort Function
.rqr Require a package

react Snippets

Prefix Method
imp→ import moduleName from 'module'
imn→ import 'module'
imd→ import { destructuredModule } from 'module'
ime→ import * as alias from 'module'
ima→ import { originalName as aliasName} from 'module'
exp→ export default moduleName
exd→ export { destructuredModule } from 'module'
exa→ export { originalName as aliasName} from 'module'
enf→ export const functionName = (params) => { }
edf→ export default (params) => { }
ednf→ export default function functionName(params) { }
met→ methodName = (params) => { }
fre→ arrayName.forEach(element => { }
fof→ for(let itemName of objectName { }
fin→ for(let itemName in objectName { }
anfn→ (params) => { }
nfn→ const functionName = (params) => { }
dob→ const {propName} = objectToDescruct
dar→ const [propName] = arrayToDescruct
sti→ setInterval(() => { }, intervalTime
sto→ setTimeout(() => { }, delayTime
prom→ return new Promise((resolve, reject) => { }
cmmb→ comment block
cp→ const { } = this.props
cs→ const { } = this.state

React

Prefix Method
imr→ import React from 'react'
imrd→ import ReactDOM from 'react-dom'
imrc→ import React, { Component } from 'react'
imrcp→ import React, { Component } from 'react' & import PropTypes from 'prop-types'
imrpc→ import React, { PureComponent } from 'react'
imrpcp→ import React, { PureComponent } from 'react' & import PropTypes from 'prop-types'
imrm→ import React, { memo } from 'react'
imrmp→ import React, { memo } from 'react' & import PropTypes from 'prop-types'
impt→ import PropTypes from 'prop-types'
imrr→ import { BrowserRouter as Router, Route, NavLink} from 'react-router-dom'
imbr→ import { BrowserRouter as Router} from 'react-router-dom'
imbrc→ import { Route, Switch, NavLink, Link } from react-router-dom'
imbrr→ import { Route } from 'react-router-dom'
imbrs→ import { Switch } from 'react-router-dom'
imbrl→ import { Link } from 'react-router-dom'
imbrnl→ import { NavLink } from 'react-router-dom'
imrs→ import React, { useState } from 'react'
imrse→ import React, { useState, useEffect } from 'react'
redux→ import { connect } from 'react-redux'
rconst→ constructor(props) with this.state
rconc→ constructor(props, context) with this.state
est→ this.state = { }
cwm→ componentWillMount = () => { } DEPRECATED!!!
cdm→ componentDidMount = () => { }
cwr→ componentWillReceiveProps = (nextProps) => { } DEPRECATED!!!
scu→ shouldComponentUpdate = (nextProps, nextState) => { }
cwup→ componentWillUpdate = (nextProps, nextState) => { } DEPRECATED!!!
cdup→ componentDidUpdate = (prevProps, prevState) => { }
cwun→ componentWillUnmount = () => { }
gdsfp→ static getDerivedStateFromProps(nextProps, prevState) { }
gsbu→ getSnapshotBeforeUpdate = (prevProps, prevState) => { }
ren→ render() { return( ) }
sst→ this.setState({ })
ssf→ this.setState((state, props) => return { })
props→ this.props.propName
state→ this.state.stateName
rcontext→ const ${1:contextName} = React.createContext()
cref→ this.${1:refName}Ref = React.createRef()
fref→ const ref = React.createRef()
bnd→ this.methodName = this.methodName.bind(this)

React Hooks

Prefix Method
rch→ import { $1 } from 'react-native'

React Native

Prefix Method
imrn→ import { $1 } from 'react-native'
rnstyle→ const styles = StyleSheet.create({})

Redux

Prefix Method
rxaction→ redux action template
rxconst→ export const $1 = '$1'
rxreducer→ redux reducer template
rxselect→ redux selector template
rxslice→ redux slice template

PropTypes

Prefix Method
pta→ PropTypes.array
ptar→ PropTypes.array.isRequired
ptb→ PropTypes.bool
ptbr→ PropTypes.bool.isRequired
ptf→ PropTypes.func
ptfr→ PropTypes.func.isRequired
ptn→ PropTypes.number
ptnr→ PropTypes.number.isRequired
pto→ PropTypes.object
ptor→ PropTypes.object.isRequired
pts→ PropTypes.string
ptsr→ PropTypes.string.isRequired
ptnd→ PropTypes.node
ptndr→ PropTypes.node.isRequired
ptel→ PropTypes.element
ptelr→ PropTypes.element.isRequired
pti→ PropTypes.instanceOf(name)
ptir→ PropTypes.instanceOf(name).isRequired
pte→ PropTypes.oneOf([name])
pter→ PropTypes.oneOf([name]).isRequired
ptet→ PropTypes.oneOfType([name])
ptetr→ PropTypes.oneOfType([name]).isRequired
ptao→ PropTypes.arrayOf(name)
ptaor→ PropTypes.arrayOf(name).isRequired
ptoo→ PropTypes.objectOf(name)
ptoor→ PropTypes.objectOf(name).isRequired
ptsh→ PropTypes.shape({ })
ptshr→ PropTypes.shape({ }).isRequired
ptany→ PropTypes.any
ptypes→ static propTypes = {}

GraphQL

Prefix Method
graphql→ import { compose, graphql } from react-apollo'
expgql-> export default compose(graphql($1, { name: $2 }))($3)

Console

Prefix Method
clg→ console.log(object)
clo→ console.log(`object`, object)
clj→ console.log(`object`, JSON.stringify(object, null, 2))
ctm→ console.time(`timeId`)
cte→ console.timeEnd(`timeId`)
cas→ console.assert(expression,object)
ccl→ console.clear()
cco→ console.count(label)
cdi→ console.dir
cer→ console.error(object)
cgr→ console.group(label)
cge→ console.groupEnd()
ctr→ console.trace(object)
cwa→ console.warn
cin→ console.info

///////////////////////

mongoDB Snippets

Type/No. Snippet Stands For Function
Generic:
1. !mdbc MongoDB Connect MongoDB connect on port 27017
2. !mdbgum MongoDB Generate User Model Generate typical user model
3. !mdba MongoDB Aggregate Model.aggregate query
4. !mdbcd MongoDB CountDocuments Model.countDocuments query
5. !mdbmr MongoDB MapReduce Model.mapReduce query
6. !mdbp MongoDB Populate Model.populate query
7. !mdbbw MongoDB BulkWrite Model.bulkWrite query
Create/Insert:
1. !mdbcr MongoDB Create Model.create query
2. !mdbcc MongoDB CreateCollection Model.createCollection query
3. !mdbim MongoDB InsertMany Model.insertMany query
Find:
1. !mdbf MongoDB Find Model.find query
2. !mdbfo MongoDB FindOne Model.findOne query
3. !mdbfbi MongoDB FindById Model.findById query
Replace:
1. !mdbro MongoDB ReplaceOne Model.replaceOne query
Update:
1. !mdbfoau MongoDB FindOneAndUpdate Model.findOneAndUpdate query
2. !mdbuo MongoDB UpdateOne Model.updateOne query
3. !mdbum MongoDB UpdateMany Model.updateMany query
Delete:
1. !mdbfoad MongoDB FindOneAndDelete Model.findOneAndDelete query
2. !mdbdo MongoDB DeleteOne Model.deleteOne query
3. !mdbdm MongoDB DeleteMany Model.deleteMany query
Methods and Statics:
1. !mdbmethod MongoDB Methods schema.methods.function
2. !mdbstatic MongoDB Statics schema.statics.function

jest snipets

  • jest-suite, adds a test suite

  • jest-test, adds a test

  • jest-test-expect, adds a test with an expect

  • jest-expect, adds an expect, using toBe()

  • jest-expect-to-equal, adds expect, using toEqual()

  • jest-test-expect-to-equal, adds a test with an expect, using toEqual()

  • jest-expect-to-throw, adds an expect, using toThrow()

  • jest-test-expect-to-throw, adds a test with an expect, using toThrow(),

  • jest-test-beforeAll, adds a beforeAll(), this method runs before all tests

  • jest-test-afterAll, adds a afterAll(), this method runs after all tests

  • supertest-init, adds the initial imports for supertest and the app you are about to test. I assume the app you are about to test looks something like this:

  • supertest-beforeall, configures supertest to use the app instance, this is a needed step to initialize supertest

  • supertest-aftereall, ensures the web app closes down after the test run, this is a needed step.

  • supertest-testget, an example of supertest testing a GET route

  • supertest-testgetwithparam, an example of supertest testing a GET route with a route parameter

  • supertest-testpost, an example of supertest testing a POST route with a payload

EJS Snippets

→ Denotes the TAB key.

Snippet→ Alternate Output
ejs→ <% <% %> - No output tag
ejsout→ <%= <%= %> - Outputs HTML value
ejsesc→ <%- <%- %> - Outputs unescaped
ejscom→ <%# <%# %> - Comment tag
ejslit→ <%% <%% %> - Outputs Literal <%
ejsinc→ <% include statement
ejsfor→ <% for Javascript Loop
ejseach→ <% forEach Javascript Loop
ejsif→ <% if Statement with condition
ejselif→ <% else if Statement - Middle section only. Assumes you have already written the first if statement.
ejselse→ <% else Statement - Middle section only. Assumes you have already written the first if statement.

hbs Snippets

Prefix Method
hbs→ simple hbs syntax
hif→ if condition
helif→ if else condition
heach→ each method
hpar→ partial method
hun→ unless method
hcusfunc→ Custom Helper function
hlog→ Hbs logger helper
hlookup→ Hbs lookup helper
hwi→ with condition

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published