Skip to content

Commit c388d06

Browse files
authored
update (#1)
* fix typo * fix: copying issues * fix: fix for tslint * port changes from PR microsoft#11 * Added survey links that I forgot >< * fix: fix lint warnings for test files * Bump tasks.json version from 0.10 to 2.00. Add default build task. * updating package-lock * looks like new version of npm adds a blank line after each npm install. Committing it * updated specific .d.ts files to point to definitely typed file. Also added recommended extensions using vs code's extensions.json * update to node 8 on travis * removed yarn as npm 5 makes it mostly unneccesary and it's causing some issues with CI * add attach debug configuration - Attach debug configuration - Scripts: debug, serve-debug, watch-debug - Readme * fix: word * . * Update build task * change tests to not always pass * separate server binding to port from other app config this seems a bit crude but allows running the tests and having them take care of setting up the port to use * might as well also add the change for issue microsoft#41 * Update README.md Added missing "node_modules/*" path mapping to README. * feat(*): update several dependencies * Removed extra "s" in sourceMap compilerOptions * Update README.md Added missing "node_modules/*" path mapping to README. * change tests to not always pass * feat(*): update several dependencies * Removed extra "s" in sourceMap compilerOptions * separate server binding to port from other app config this seems a bit crude but allows running the tests and having them take care of setting up the port to use * fix up tests * update repo field * made some changes to mongo connection
1 parent 76c4593 commit c388d06

21 files changed

+5236
-7241
lines changed

.env.example

Lines changed: 1 addition & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -3,27 +3,5 @@ MONGOLAB_URI=mongodb://localhost:27017
33

44
SESSION_SECRET=ashdfjhasdlkjfhalksdjhflak
55

6-
MAILGUN_USER=postmaster@sandbox697fcddc09814c6b83718b9fd5d4e5dc.mailgun.org
7-
MAILGUN_PASSWORD=29eldds1uri6
8-
9-
SENDGRID_USER=hslogin
10-
SENDGRID_PASSWORD=hspassword00
11-
126
FACEBOOK_ID=754220301289665
13-
FACEBOOK_SECRET=41860e58c256a3d7ad8267d3c1939a4a
14-
15-
INSTAGRAM_ID=9f5c39ab236a48e0aec354acb77eee9b
16-
INSTAGRAM_SECRET=5920619aafe842128673e793a1c40028
17-
18-
GITHUB_ID=cb448b1d4f0c743a1e36
19-
GITHUB_SECRET=815aa4606f476444691c5f1c16b9c70da6714dc6
20-
21-
TWITTER_KEY=6NNBDyJ2TavL407A3lWxPFKBI
22-
TWITTER_SECRET=ZHaYyK3DQCqv49Z9ofsYdqiUgeoICyh6uoBgFfu7OeYC7wTQKa
23-
24-
GOOGLE_ID=828110519058.apps.googleusercontent.com
25-
GOOGLE_SECRET=JdZsIaWhUFIchmC1a_IZzOHb
26-
27-
TWILIO_SID=AC6f0edc4c47becc6d0a952536fc9a6025
28-
TWILIO_TOKEN=a67170ff7afa2df3f4c7d97cd240d0f3
29-
7+
FACEBOOK_SECRET=41860e58c256a3d7ad8267d3c1939a4a

.travis.yml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11

22
{
33
"language": "node_js",
4-
"node_js": "6",
4+
"node_js": "8",
55
"services": [
66
"mongodb"
77
],

.vscode/extensions.json

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{
2+
"recommendations": [
3+
"eg2.tslint",
4+
"streetsidesoftware.code-spell-checker"
5+
]
6+
}

.vscode/launch.json

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,12 @@
44
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
55
"version": "0.2.0",
66
"configurations": [
7+
{
8+
"type": "node",
9+
"request": "attach",
10+
"name": "Attach",
11+
"port": 9229
12+
},
713
{
814
"type": "node",
915
"request": "launch",
@@ -13,7 +19,7 @@
1319
"outFiles": [
1420
"../dist/**/*.js"
1521
],
16-
"preLaunchTask": "build",
22+
"preLaunchTask": "npm: build",
1723
"protocol": "inspector"
1824
}
1925
]

.vscode/tasks.json

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
11
{
22
// See https://go.microsoft.com/fwlink/?LinkId=733558
33
// for the documentation about the tasks.json format
4-
"version": "0.1.0",
5-
"command": "npm",
6-
"isShellCommand": true,
7-
"showOutput": "always",
8-
"suppressTaskName": true,
4+
"version": "2.0.0",
95
"tasks": [
106
{
11-
"taskName": "build",
12-
"args": ["run", "build"]
7+
"type": "npm",
8+
"script": "build",
9+
"group": {
10+
"kind": "build",
11+
"isDefault": true
12+
}
1313
}
1414
]
1515
}

README.md

Lines changed: 20 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ Navigate to `http://localhost:3000`
2929

3030
# TypeScript + Node
3131
The main purpose of this repository is to show a good end-to-end project setup and workflow for writing Node code in TypeScript.
32-
I will try to keep this as up-to-date as possible, but community contributions and recommendations for improvements are encourage and will be most welcome.
32+
I will try to keep this as up-to-date as possible, but community contributions and recommendations for improvements are encouraged and will be most welcome.
3333

3434
In the next few sections I will call out everything that changes when adding TypeScript to an Express project.
3535
Note that all of this has already been setup for this project, but feel free to use this as a reference for converting other Node.js project to TypeScript.
@@ -48,13 +48,13 @@ For other editors, make sure you have the corresponding [TypeScript plugin](http
4848

4949
## Project Structure
5050
The most obvious difference in a TypeScript + Node project is the folder structure.
51-
In a TypeScript project, you it's best to have separate _source_ and _distributable_ files.
51+
In a TypeScript project, it's best to have separate _source_ and _distributable_ files.
5252
TypeScript (`.ts`) files live in your `src` folder and after compilation are output as JavaScript (`.js`) in the `dist` folder.
5353
The `test` and `views` folders remain top level as expected.
5454

5555
The full folder structure of this app is explained below:
5656

57-
> **Note!** Make sure you have already built the app using `npm run build` or `yarn run build`
57+
> **Note!** Make sure you have already built the app using `npm run build`
5858
5959
| Name | Description |
6060
| ------------------------ | --------------------------------------------------------------------------------------------- |
@@ -66,7 +66,7 @@ The full folder structure of this app is explained below:
6666
| **src/controllers** | Controllers define functions that respond to various http requests |
6767
| **src/models** | Models define Mongoose schemas that will be used in storing and retrieving data from MongoDB |
6868
| **src/public** | Static assets that will be used client side |
69-
| **src/types** | Holds .d.ts files not found on DefinitelyTyped. Covered more in this [section](#) |
69+
| **src/types** | Holds .d.ts files not found on DefinitelyTyped. Covered more in this [section](#type-definition-dts-files) |
7070
| **src**/server.ts | Entry point to your express app |
7171
| **test** | Contains your tests. Seperate from source because there is a different build process. |
7272
| **views** | Views define how your app renders on the client. In this case we're using pug |
@@ -77,7 +77,6 @@ The full folder structure of this app is explained below:
7777
| tsconfig.json | Config settings for compiling server code written in TypeScript |
7878
| tsconfig.tests.json | Config settings for compiling tests written in TypeScript |
7979
| tslint.json | Config settings for TSLint code style checking |
80-
| yarn.lock | Contains same dependency version info as package.json, but used with yarn |
8180

8281
## Building the project
8382
It is rare for JavaScript projects not to have some kind of build pipeline these days, however Node projects typically have the least amount build configuration.
@@ -138,7 +137,7 @@ All the different build steps are orchestrated via [npm scripts](https://docs.np
138137
Npm scripts basically allow us to call (and chain) terminal commands via npm.
139138
This is nice because most JavaScript tools have easy to use command line utilities allowing us to not need grunt or gulp to manage our builds.
140139
If you open `package.json`, you will see a `scripts` section with all the different scripts you can call.
141-
To call a script, simply run `npm run <script-name>` (or `yarn run <script-name` if using yarn) from the command line.
140+
To call a script, simply run `npm run <script-name>` from the command line.
142141
You'll notice that npm scripts can call each other which makes it easy to compose complex builds out of simple individual build scripts.
143142
Below is a list of all the scripts this template has available:
144143

@@ -188,6 +187,7 @@ In the `tsconfig.json` for this project you'll see the following:
188187
"baseUrl": ".",
189188
"paths": {
190189
"*": [
190+
"node_modules/*",
191191
"src/types/*"
192192
]
193193
}
@@ -205,7 +205,7 @@ The [README](https://github.com/Microsoft/dts-gen#dts-gen-a-typescript-definitio
205205
In this project, `bcrypt-nodejs.d.ts`, `fbgraph.d.ts`, and `lusca.d.ts` were all generated using `dts-gen`.
206206

207207
#### Writing a `.d.ts` file
208-
If generating a `.d.ts` using `dts-gen` isn't working, [you should tell me about it first](TODO-survey-link), but then you can create your own `.d.ts` file.
208+
If generating a `.d.ts` using `dts-gen` isn't working, [you should tell me about it first](https://www.surveymonkey.com/r/LN2CV82), but then you can create your own `.d.ts` file.
209209

210210
If you just want to silence the compiler for the time being, create a file called `<some-library>.d.ts` in your `types` folder and then add this line of code:
211211
```ts
@@ -219,7 +219,7 @@ The reason it's so easy to get great `.d.ts` files for most libraries is that de
219219
Contributing `.d.ts` files is a great way to get into the open source community if it's something you've never tried before, and as soon as your changes are accepted, every other developer in the world has access to your work.
220220

221221
If you're interested in giving it a shot, check out the [guidance on DefinitelyTyped](https://github.com/definitelyTyped/DefinitelyTyped/#how-can-i-contribute).
222-
If you're not interested, [you should tell me why](TODO-survey-link) so we can help make it easier in the future!
222+
If you're not interested, [you should tell me why](https://www.surveymonkey.com/r/LN2CV82) so we can help make it easier in the future!
223223

224224
### Summary of `.d.ts` management
225225
In general if you stick to the following steps you should have minimal `.d.ts` issues;
@@ -253,7 +253,7 @@ The best part of source maps is when configured correctly, you don't even know t
253253
First you need to make sure your `tsconfig.json` has source map generation enabled:
254254
```json
255255
"compilerOptions" {
256-
"sourceMaps": true
256+
"sourceMap": true
257257
}
258258
```
259259
With this option enabled, next to every `.js` file that the TypeScript compiler outputs there will be a `.map.js` file as well.
@@ -291,7 +291,7 @@ This is mostly identical to the "Node.js: Launch Program" template with a couple
291291
| `"program": "${workspaceRoot}/dist/server.js",` | Modified to point to our entry point in `dist` |
292292
| `"smartStep": true,` | Won't step into code that doesn't have a source map |
293293
| `"outFiles": [...]` | Specify where output files are dropped. Use with source maps |
294-
| `"protocol": inspector,` | Use the new Node debug protocal because we're on the latest node|
294+
| `"protocol": inspector,` | Use the new Node debug protocol because we're on the latest node|
295295

296296
With this file in place, you can hit `F5` to serve the project with the debugger already attached.
297297
Now just set your breakpoints and go!
@@ -300,6 +300,11 @@ Now just set your breakpoints and go!
300300
VS Code will try to launch on the same port and error out.
301301
Likewise be sure to stop the debugger before returning to your normal `npm start` process.
302302

303+
#### Using attach debug configuration
304+
VS Code debuggers also support attaching to an already running program. The `Attach` configuration has already configured, everything you need to do is change `Debug Configuration` to `Attach` and hit `F5`.
305+
306+
> Tips! Instead of running `npm start`, using `npm run debug` and `Attach Configuration` that make you don't need to stop running project to debug.
307+
303308
## Testing
304309
For this project, I chose [Jest](https://facebook.github.io/jest/) as our test framework.
305310
While Mocha is probably more common, Mocha seems to be looking for a new maintainer and setting up TypeScript testing in Jest is wicked simple.
@@ -340,7 +345,7 @@ This all happens in memory when you run the tests, so there are no output `.js`
340345

341346
### Writing tests
342347
Writing tests for web apps has entire books dedicated to it and best practices are strongly influenced by personal style, so I'm deliberately avoiding discussing how or when to write tests in this guide.
343-
However, if prescriptive guidance on testing is something that you're interested in, [let me know](TODO-survey-link), I'll do some homework and get back to you.
348+
However, if prescriptive guidance on testing is something that you're interested in, [let me know](https://www.surveymonkey.com/r/LN2CV82), I'll do some homework and get back to you.
344349

345350
## TSLint
346351
TSLint is a code linter which mainly helps catch minor code quality and style issues.
@@ -397,14 +402,14 @@ In that file you'll find two sections:
397402
| Package | Description |
398403
| ------------------------------- | --------------------------------------------------------------------- |
399404
| concurrently | Utility that manages multiple concurrent tasks. Used with npm scripts |
400-
| jest | Reports real-time server metrics for Express. |
401-
| node-sass | GitHub API library. |
405+
| jest | Testing library for JavaScript. |
406+
| node-sass | Allows to compile .scss files to .css |
402407
| supertest | HTTP assertion library. |
403-
| ts-test | Instagram API library. |
408+
| ts-test | A preprocessor with sourcemap support to help use TypeScript wit Jest.|
404409
| tslint | Linter (similar to ESLint) for TypeScript files |
405410
| typescript | JavaScript compiler/type checker that boosts JavaScript productivity |
406411

407-
To install or update these dependencies you can use either `npm` or `yarn`.
412+
To install or update these dependencies you can use `npm install` or `npm update`.
408413

409414
# Other
410415
Here is a section of miscellaneous tips.

copyStaticAssets.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
var shell = require('shelljs');
22

3-
shell.cp('-R', 'src/public/js/lib', 'dist/public/js/lib');
4-
shell.cp('-R', 'src/public/fonts', 'dist/public/fonts');
5-
shell.cp('-R', 'src/public/images', 'dist/public/images');
3+
shell.cp('-R', 'src/public/js/lib', 'dist/public/js/');
4+
shell.cp('-R', 'src/public/fonts', 'dist/public/');
5+
shell.cp('-R', 'src/public/images', 'dist/public/');

0 commit comments

Comments
 (0)