MDriven Turnkey site creation
m ((username removed) (log details removed): Moving to Training namespace)
(28 intermediate revisions by 4 users not shown)
Line 1: Line 1:
[https://www.capableobjects.com/downloads/downloads-2/ '''Download'''] the latest version of MDriven Designer. ''(Note! To open MDriven Designer from your browser you need to have a ClickOnce plugin: [https://chrome.google.com/webstore/detail/meta4-clickonce-launcher/jkncabbipkgbconhaajbapbhokpbgkdc?utm_source=chrome-app-launcher-info-dialog '''Chrome'''], [https://addons.mozilla.org/sv-SE/firefox/addon/ffclickonce/ '''Firefox''']).''
[https://www.capableobjects.com/downloads/downloads-2/ '''Download'''] the latest version of MDriven Designer. ''(Note! To open MDriven Designer from your browser, you need to have a ClickOnce plugin: [https://chrome.google.com/webstore/detail/meta4-clickonce-launcher/jkncabbipkgbconhaajbapbhokpbgkdc?utm_source=chrome-app-launcher-info-dialog '''Chrome'''], [https://addons.mozilla.org/sv-SE/firefox/addon/ffclickonce/ '''Firefox''']).''


When MDriven Designer has opened, head to CloudForm window.
When MDriven Designer has opened, head to the CloudForm window.
[[File:CloudFrom window.png|none|thumb|441x441px|CloudForm in MDriven Designer]]In the CloudForm you can choose the option that suits you. If you don't have an account you can '''register''' or if you already have an account you can '''login'''.
[[File:CloudFrom window.png|none|thumb|441x441px|CloudForm in MDriven Designer]]In the CloudForm, choose the option that suits you. If you don't have an account, you can '''register''' or if you already have an account, you can '''log in'''.


After authorization press "Back to home or login" button. Now, you can head to "'''New site Request'''".
After authorization, press the "Back to home or login" button. Now, you can head to "'''New site Request'''".
[[File:Request site creation.png|none|thumb|450x450px|Request site creation]]When you pressed "New site Request" you will see the Existing Creation requests page.  
[[File:Request site creation.png|none|thumb|450x450px|Request site creation]]When you press "New site Request," you will see the Existing Creation Requests page.  


To add creation request press "'''Add Creation Request'''" button and enter the application name then press "'''Save'''" button.
To add a creation request, press the "'''Add Creation Request'''" button and enter the application name, then press the "'''Save'''" button.
[[File:Add creation request and name of application.png|none|thumb|462x462px|Add creation request and name of application]]
[[File:Add creation request and name of application.png|none|thumb|462x462px|Add a creation request and the name of the application]]
Now, you just need to wait when our service will deploy MDriven Turnkey Application for you. It takes up to 5 minutes.
Now, you just need to wait for when our service will deploy MDriven Turnkey Application for you. It takes up to 5 minutes.


You can see the changes of creation and site state of your application.  
You can see the changes in the creation and site state of your application.  
[[File:Deployment status of application.png|none|thumb|483x483px|Deployment status of application]]Creation State: '''AvailableForCreationNode''' -> '''CreationNodeWorking''' -> '''CreationSuccess'''  
[[File:Deployment status of application.png|none|thumb|483x483px|Deployment status of the application]]Creation State: '''AvailableForCreationNode''' -> '''CreationNodeWorking''' -> '''CreationSuccess'''  


Site state: '''Deploying''' -> '''Deployed'''
Site state: '''Deploying''' -> '''Deployed'''


When site is deployed you can go back (press "Back to home or login" button) and pick this site as a work site.
When the site is deployed, you can go back (press the '''Back to home''' or '''login''' button) and pick this site as a work site.
[[File:Pick site as a work site.png|none|thumb|482x482px|Pick site as a work site]]
[[File:Pick site as a work site.png|none|thumb|482x482px|Pick site as a work site]]
When you picked your site you can '''open it in external browser''' or '''check server status''', '''download/upload model'''.
When you have picked your site, you can '''open it in an external browser''' or '''check the server status''', or '''download/upload the model'''.


== Video Tutorial ==
Now, your Turnkey application is installed. It is pretty much an empty application with only authorization services. You can start modeling or applying examples to your site. 


<html>
Still have questions? Watch the video tutorial below.


<h4> In this session we set up the environment for local development and debugging in visual studio - still using the data and model in the cloud. We also replace one of the standard views from inside VS. </h4>
See also: [[Troubleshooting Turnkey deployment]]


<p>
== Video Tutorial ==
<em>To make your experience more comfortable, we set the main tags mentioned in the video to the right bar menu of this mini player. Choose the interesting subtitle on the list and immediately get to the exact theme timeplace in the video. Now you can pick any topic to be instructed without watching the whole video.</em>
<style type="text/css">
p {
opacity: 0.7;
text-align: justify;
width: 90%
}
</style>
</p>


<br>
<html>
<div id="video12">
<iframe width="740" height="500" src="https://www.youtube.com/embed/g1yr-Is8XXY?rel=0&autoplay=0" frameborder="0" allowfullscreen></iframe>
  <div>
    <span data-video="g1yr-Is8XXY" data-start="7" tabindex="0"> Installing MDriven Turnkey Locally </span>
    <span data-video="g1yr-Is8XXY" data-start="30" tabindex="0"> Setting Application in Visual Studio </span>
    <span data-video="g1yr-Is8XXY" data-start="129" tabindex="0"> Start debugging  </span>
    <span data-video="g1yr-Is8XXY" data-start="175" tabindex="0"> Replacing the standard view in VS</span>
</div> 
</div>
 
<script>
var IMG = document.querySelectorAll('#video12 span'),
    IFRAME = document.querySelector('#video12 iframe');
for (var i = 0; i < IMG.length; i++) {
  IMG[i].onclick = function() {
    IFRAME.src = 'https://www.youtube.com/embed/' + this.dataset.video + '?rel=0&autoplay=1';
    if(this.dataset.end) IFRAME.src = IFRAME.src.replace(/([\s\S]*)/g, '$1&end=' + this.dataset.end);
    if(this.dataset.start) IFRAME.src = IFRAME.src.replace(/([\s\S]*)/g, '$1&start=' + this.dataset.start);
    this.style.backgroundColor='rgba(0,0,0,.2)';
  }
}
</script>
<h4> In this session we show how you bind to things in your view models with angular to completely take control of all rendering with html5. Continue where we left off having MDriven turnkey in Visual Studio for local development. </h4>


<p>
<p class="video-warn">
<em>To make your experience more comfortable, we set the main tags mentioned in the video to the right bar menu of this mini player. Choose the interesting subtitle on the list and immediately get to the exact theme timeplace in the video. Now you can pick any topic to be instructed without watching the whole video.</em>
  To make your experience smooth, we set the main tags mentioned in the video to the right bar menu of this mini-player. Choose an interesting subtitle on the list and immediately get to the exact theme navigation item place in the video. Now you can pick any topic to be instructed on without watching the whole video.
<style type="text/css">
p {
opacity: 0.7;
text-align: justify;
width: 90%
}
</style>
</p>
</p>


<style>
<div class="video">
#video12 {
   <div class="video__wrapper">
  position: relative;
    <iframe src="https://www.youtube.com/embed/Hp1Cw022bvg?rel=0&autoplay=0" frameborder="0" allowfullscreen></iframe>
  height: 500px;
   </div>
  width:560px;
  <div class="video__navigation">
  padding-bottom: 10px;
      <span class="navigation-item" data-video="Hp1Cw022bvg"data-start="0" tabindex="0"> MDriven Turnkey site creation</span>
}
      <span class="navigation-item" data-video="Hp1Cw022bvg" data-start="0" tabindex="0"> Register/Login in MDriven Designer </span>
#video12 iframe {
      <span class="navigation-item" data-video="Hp1Cw022bvg" data-start="32" tabindex="0"> New site request </span>
   position: absolute;
      <span class="navigation-item" data-video="Hp1Cw022bvg" data-start="52" tabindex="0"> Creation and Deploy process </span>
  min-height: auto;
      <span class="navigation-item" data-video="Hp1Cw022bvg" data-start="120" tabindex="0"> Start modeling </span>
  min-width: auto;
      <span class="navigation-item" data-video="Hp1Cw022bvg" data-start="240" tabindex="0"> Apply example to site</span>
}
  </div>
#video12 div {
  position: absolute;
  top: 0;
  left:760px;
  width: 260px;
  height: 100%;
  padding-left: 10px;
  overflow-y: auto;
}
span {
    font-size: 18;
    display:block;
  padding: 2px 10px 0.5px 10px;
    padding-bottom: 0.5;
    padding-top: 0.5;
  opacity: 0.7;
}
span:hover {
  color: #0000FF;
  cursor: pointer;
}
span:focus {
  color: blue;
</style>
 
<br>
<div id="video12">
<iframe width="740" height="500" src="https://www.youtube.com/embed/Z4uLuMJA8KM?rel=0&autoplay=0" frameborder="0" allowfullscreen></iframe>
   <div>
    <span data-video="Z4uLuMJA8KM" data-start="10" tabindex="0"> Setting editable HTML in Visual Studio </span>
    <span data-video="Z4uLuMJA8KM" data-start="67" tabindex="0"> Development View </span>
    <span data-video="Z4uLuMJA8KM" data-start="185" tabindex="0"> Actions' view functinality and buttons</span>
    <span data-video="Z4uLuMJA8KM" data-start="304" tabindex="0"> vCurrent boolean  </span>
    <span data-video="Z4uLuMJA8KM" data-start="335" tabindex="0"> Designing the page</span>
    <span data-video="Z4uLuMJA8KM" data-start="450" tabindex="0"> Setting navigation  </span>
    <span data-video="Z4uLuMJA8KM" data-start="538" tabindex="0"> Extend the view </span>  
    <span data-video="Z4uLuMJA8KM" data-start="581" tabindex="0"> Combobox/selectbox in HTML</span>
    <span data-video="Z4uLuMJA8KM" data-start="811" tabindex="0"> default naming</span>  
    <span data-video="Z4uLuMJA8KM" data-start="880" tabindex="0"> image styling widget </span>
    <span data-video="Z4uLuMJA8KM" data-start="946" tabindex="0"> global actions in html </span>
</div>
</div>
</div>
<script>
var IMG = document.querySelectorAll('#video12 span'),
    IFRAME = document.querySelector('#video12 iframe');
for (var i = 0; i < IMG.length; i++) {
  IMG[i].onclick = function() {
    IFRAME.src = 'https://www.youtube.com/embed/' + this.dataset.video + '?rel=0&autoplay=1';
    if(this.dataset.end) IFRAME.src = IFRAME.src.replace(/([\s\S]*)/g, '$1&end=' + this.dataset.end);
    if(this.dataset.start) IFRAME.src = IFRAME.src.replace(/([\s\S]*)/g, '$1&start=' + this.dataset.start);
    this.style.backgroundColor='rgba(0,0,0,.2)';
  }
}
</script>
</html>
</html>
[[Category:Beginner]]

Revision as of 21:29, 20 December 2023

Download the latest version of MDriven Designer. (Note! To open MDriven Designer from your browser, you need to have a ClickOnce plugin: Chrome, Firefox).

When MDriven Designer has opened, head to the CloudForm window.

CloudForm in MDriven Designer

In the CloudForm, choose the option that suits you. If you don't have an account, you can register or if you already have an account, you can log in.

After authorization, press the "Back to home or login" button. Now, you can head to "New site Request".

Request site creation

When you press "New site Request," you will see the Existing Creation Requests page.

To add a creation request, press the "Add Creation Request" button and enter the application name, then press the "Save" button.

Add a creation request and the name of the application

Now, you just need to wait for when our service will deploy MDriven Turnkey Application for you. It takes up to 5 minutes.

You can see the changes in the creation and site state of your application.

Deployment status of the application

Creation State: AvailableForCreationNode -> CreationNodeWorking -> CreationSuccess

Site state: Deploying -> Deployed

When the site is deployed, you can go back (press the Back to home or login button) and pick this site as a work site.

Pick site as a work site

When you have picked your site, you can open it in an external browser or check the server status, or download/upload the model.

Now, your Turnkey application is installed. It is pretty much an empty application with only authorization services. You can start modeling or applying examples to your site.

Still have questions? Watch the video tutorial below.

See also: Troubleshooting Turnkey deployment

Video Tutorial

To make your experience smooth, we set the main tags mentioned in the video to the right bar menu of this mini-player. Choose an interesting subtitle on the list and immediately get to the exact theme navigation item place in the video. Now you can pick any topic to be instructed on without watching the whole video.

MDriven Turnkey site creation Register/Login in MDriven Designer New site request Creation and Deploy process Start modeling Apply example to site

This page was edited 12 days ago on 05/09/2024. What links here
Retrieved from "https://wiki.mdriven.net/index.php?title=Training:MDriven_Turnkey_site_creation&oldid=15032"

© MDRIVEN . All Rights Reserved

Glossary API Docs
MDriven World | Portal | Blog | YouTube | StackOverflow | Facebook

© MDRIVEN . All Rights Reserved