This repository has been archived by the owner on Oct 25, 2023. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 10
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* add styled landing page * add Heroku-specific docs * change more links to use typescript docs
- Loading branch information
1 parent
69c4e19
commit eceeb6e
Showing
9 changed files
with
165 additions
and
12 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1 @@ | ||
| web: npm start |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,6 @@ | ||
| { | ||
| "name": "Start on Heroku: TypeScript", | ||
| "description": "A barebones TypeScript app using Express 4", | ||
| "repository": "https://github.com/heroku/typescript-getting-started", | ||
| "keywords": ["node", "typescript", "express", "heroku"] | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,12 +1,12 @@ | ||
| import express from 'express'; | ||
| import path from 'path'; | ||
|
|
||
| const PORT = process.env.PORT || 5000; | ||
| const server = express(); | ||
|
|
||
| server.get('/', (_: express.Request, res: express.Response) => { | ||
| res.send("Hello World!"); | ||
| }); | ||
|
|
||
| server.listen(PORT, () => { | ||
| console.log(`Listening on ${PORT}`); | ||
| }); | ||
| express() | ||
| .use(express.static(path.join(__dirname, '../public'))) | ||
| .set('views', path.join(__dirname, '../views')) | ||
| .set('view engine', 'ejs') | ||
| .get('/', (req, res) => res.render('pages/index')) | ||
| .listen(PORT, () => console.log(`Listening on ${PORT}`)); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,15 @@ | ||
| .jumbotron { | ||
| background: #532F8C; | ||
| color: white; | ||
| padding-bottom: 80px; } | ||
| .jumbotron .btn-primary { | ||
| background: #845ac7; | ||
| border-color: #845ac7; } | ||
| .jumbotron .btn-primary:hover { | ||
| background: #7646c1; } | ||
| .jumbotron p { | ||
| color: #d9ccee; | ||
| max-width: 75%; | ||
| margin: 1em auto 2em; } | ||
| .navbar + .jumbotron { | ||
| margin-top: -20px; } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,23 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <%- include ("../partials/header.ejs") %> | ||
| </head> | ||
|
|
||
| <body> | ||
|
|
||
| <%- include ("../partials/nav.ejs") %> | ||
|
|
||
| <div class="container"> | ||
| <h2>Database Results</h2> | ||
|
|
||
| <ul> | ||
| <% results.forEach(function(r) { %> | ||
| <li><%= r.id %> - <%= r.name %></li> | ||
| <% }); %> | ||
| </ul> | ||
|
|
||
| </div> | ||
|
|
||
| </body> | ||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,64 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <%- include ("../partials/header.ejs") %> | ||
| </head> | ||
|
|
||
| <body> | ||
|
|
||
| <%- include ("../partials/nav.ejs") %> | ||
|
|
||
| <div class="jumbotron text-center"> | ||
| <div class="container"> | ||
| <h1>Getting Started on Heroku with TypeScript</h1> | ||
| <p>This is a sample TypeScript application deployed to Heroku. It's a reasonably simple app - but a good foundation for understanding how to get the most out of the Heroku platform.</p> | ||
| <a type="button" class="btn btn-lg btn-default" href="https://devcenter.heroku.com/articles/getting-started-with-typescript"><span class="glyphicon glyphicon-flash"></span> Getting Started on Heroku with TypeScript</a> | ||
| <a type="button" class="btn btn-lg btn-primary" href="https://github.com/heroku/typescript-getting-started"><span class="glyphicon glyphicon-download"></span> Source on GitHub</a> | ||
| </div> | ||
| </div> | ||
| <div class="container"> | ||
| <div class="alert alert-info text-center" role="alert"> | ||
| To deploy your own copy, and learn the fundamentals of the Heroku platform, head over to the <a href="https://devcenter.heroku.com/articles/getting-started-with-typescript" class="alert-link">Getting Started on Heroku with TypeScript</a> tutorial. | ||
| </div> | ||
| <hr> | ||
| <div class="row"> | ||
| <div class="col-md-6"> | ||
| <h3><span class="glyphicon glyphicon-info-sign"></span> How this sample app works</h3> | ||
| <ul> | ||
| <li>This app was deployed to Heroku, either using Git or by using <a href="https://github.com/heroku/typescript-getting-started">Heroku Button</a> on the repository.</li> | ||
|
|
||
| <li>When Heroku received the source code, it fetched all the dependencies in the <a href="https://github.com/heroku/typescript-getting-started/blob/main/package.json">package.json</a>, creating a deployable slug.</li> | ||
| <li>The platform then spins up a dyno, a lightweight container that provides an isolated environment in which the slug can be mounted and executed.</li> | ||
| <li>You can scale your app, manage it, and deploy over <a href="https://addons.heroku.com/">150 add-on services</a>, from the Dashboard or CLI.</li> | ||
| </ul> | ||
| </div> | ||
| <div class="col-md-6"> | ||
| <h3><span class="glyphicon glyphicon-link"></span> Next Steps</h3> | ||
| <ul> | ||
| <li>If you are following the <a href="https://devcenter.heroku.com/articles/getting-started-with-typescript">Getting Started</a> guide, then please head back to the tutorial and follow the next steps!</li> | ||
| <li>If you deployed this app by deploying the Heroku Button, then in a command line shell, run:</li> | ||
| <ul> | ||
| <li><code>git clone https://github.com/heroku/typescript-getting-started.git</code> - this will create a local copy of the source code for the app</li> | ||
| <li><code>cd typescript-getting-started</code> - change directory into the local source code repository</li> | ||
| <li><code>heroku git:remote -a <your-app-name></code> - associate the Heroku app with the repository</li> | ||
| <li>You'll now be set up to run the app locally, or <a href="https://devcenter.heroku.com/articles/getting-started-with-typescript#push-local-changes">deploy changes</a> to Heroku</li> | ||
| </ul> | ||
| </ul> | ||
| <h3><span class="glyphicon glyphicon-link"></span> Helpful Links</h3> | ||
| <ul> | ||
| <li><a href="https://www.heroku.com/home">Heroku</a></li> | ||
| <li><a href="https://devcenter.heroku.com/">Heroku Dev Center</a></li> | ||
| <li><a href="https://devcenter.heroku.com/articles/getting-started-with-typescript">Getting Started on Heroku with TypeScript</a></li> | ||
| <li><a href="https://devcenter.heroku.com/articles/getting-started-with-nodejs">Getting Started on Heroku with Node.js</a></li> | ||
| <li><a href="https://devcenter.heroku.com/articles/deploying-nodejs">Deploying Node.js Apps on Heroku</a></li> | ||
| </ul> | ||
| </div> | ||
| </div> <!-- row --> | ||
| <div class="alert alert-info text-center" role="alert"> | ||
| Please do work through the Getting Started guide, even if you do know how to build such an application. The guide covers the basics of working with Heroku, and will familiarize you with all the concepts you need in order to build and deploy your own apps. | ||
| </div> | ||
| </div> | ||
|
|
||
|
|
||
| </body> | ||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,5 @@ | ||
| <title>TypeScript Getting Started on Heroku</title> | ||
| <link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" /> | ||
| <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> | ||
| <script type="text/javascript" src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> | ||
| <link rel="stylesheet" type="text/css" href="/stylesheets/main.css" /> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,34 @@ | ||
| <nav class="navbar navbar-default navbar-static-top navbar-inverse"> | ||
| <div class="container"> | ||
| <ul class="nav navbar-nav"> | ||
| <li class="active"> | ||
| <a href="/"><span class="glyphicon glyphicon-home"></span> Home</a> | ||
| </li> | ||
| <li> | ||
| <a href="https://devcenter.heroku.com/articles/how-heroku-works"><span class="glyphicon glyphicon-user"></span> How Heroku Works</a> | ||
| </li> | ||
| <li class="dropdown"> | ||
| <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><span class="glyphicon glyphicon-info-sign"></span> Getting Started Guides <span class="caret"></span></a> | ||
| <ul class="dropdown-menu" role="menu"> | ||
| <li><a href="https://devcenter.heroku.com/articles/getting-started-with-ruby">Getting Started on Heroku with Ruby</a></li> | ||
| <li><a href="https://devcenter.heroku.com/articles/getting-started-with-nodejs">Getting Started on Heroku with Node.js</a></li> | ||
| <li><a href="https://devcenter.heroku.com/articles/getting-started-with-typescript">Getting Started on Heroku with TypeScript</a></li> | ||
| <li><a href="https://devcenter.heroku.com/articles/getting-started-with-php">Getting Started on Heroku with PHP</a></li> | ||
| <li><a href="https://devcenter.heroku.com/articles/getting-started-with-python">Getting Started on Heroku with Python</a></li> | ||
| <li><a href="https://devcenter.heroku.com/articles/getting-started-with-java">Getting Started on Heroku with Java</a></li> | ||
| <li><a href="https://devcenter.heroku.com/articles/getting-started-with-go">Getting Started on Heroku with Go</a></li> | ||
| <li><a href="https://devcenter.heroku.com/articles/getting-started-with-clojure">Getting Started on Heroku with Clojure</a></li> | ||
| <li><a href="https://devcenter.heroku.com/articles/getting-started-with-scala">Getting Started on Heroku with Scala</a></li> | ||
| <li class="divider"></li> | ||
| <li><a href="https://devcenter.heroku.com/articles/getting-started-with-heroku-and-connect-without-local-dev">Getting Started on Heroku with Heroku Connect</a></li> | ||
| <li><a href="https://devcenter.heroku.com/articles/getting-started-with-jruby">Getting Started on Heroku with Ruby (Microsoft Windows)</a></li> | ||
| </ul> | ||
| </li> | ||
| </ul> | ||
| <ul class="nav navbar-nav navbar-right"> | ||
| <li class="navbar-right"> | ||
| <a href="https://devcenter.heroku.com"><span class="glyphicon glyphicon-book"></span> Heroku Dev Center</a> | ||
| </li> | ||
| </ul> | ||
| </div> | ||
| </nav> |