Name: swift-bluemix-dev-cli
Owner: International Business Machines
Description: Create a React-based web application in less than 10 minutes
Created: 2017-03-14 05:36:56.0
Updated: 2017-07-14 12:02:04.0
Pushed: 2017-03-17 15:47:35.0
Size: 2285
Language: null
GitHub Committers
| User | Most Recent Commit | # Commits |
|---|
Other Committers
| User | Most Recent Commit | # Commits |
|---|
Learn to scaffold out a complete web application that uses a Kitura server to serve a React-based UI:
Download and install the Developer plugin for the Bluemix CLI:
lugin install dev -r Bluemix
Use the dev plugin to create a new project
ev create
Select Web pattern, Webpack + React, and Swift
Name your project, give it a hostname (needs to be unique), and select no services
Wait for your project to be generated (should take about 30 seconds)
Once completed, you should see “The project, … has been saved into the current directory.”
Change into the directory of your project
yReact
Install the node packages and run gulp:
stall node dependencies](images/install-node-deps.png)
n gulp](images/run-gulp.png)
Build the Swift project (takes 2 minutes)
t build -Xlinker -lc++
When you run this command, the Swift Package Manager will download all of the dependencies your project needs into your Packages directory. Downloading the packages on your first compile, can take a bit of time. Future builds will be very fast, however.
Run the application
It's time to run your application.
ld/debug/MyReact
You will probably be getting a message about accepting incoming connections if you're on macOS. Select 'Allow'. Notice that at the end of the run, the logger says that the server is running on port 8080.
Open your browser and see your running application.
Open your project in your favorite editor or IDE
If you want to use Xcode, run swift package generate-xcodeproj first.
VSCode, Atom, and Sublime are all good choices, too.
Make changes, for instance:
rt React from 'react';
rt {render} from 'react-dom';
oad stylesheet
ire("../sass/default.scss");
s App extends React.Component {
er () {
return (
<section>
<p>Hello, World!</p>
</section>
);
er(<App/>, document.getElementById('app'));
Re-run npm install
Refresh your browser
