Difference between revisions of "Team:CHINA CD UESTC/Protocol"

 
(23 intermediate revisions by 2 users not shown)
Line 1: Line 1:
 
{{Template:Team:CHINA_CD_UESTC/menu}}
 
{{Template:Team:CHINA_CD_UESTC/menu}}
 +
{{Template:Team:CHINA_CD_UESTC/cssstyle}}
 +
 +
 +
 
<!DOCTYPE html>
 
<!DOCTYPE html>
<!-- saved from url=(0028)http://www.whitefrontier.ch/ -->
+
<html>
<html lang="en" class="js flexbox canvas canvastext webgl no-touch geolocation postmessage websqldatabase indexeddb hashchange history draganddrop websockets rgba hsla multiplebgs backgroundsize borderimage borderradius boxshadow textshadow opacity cssanimations csscolumns cssgradients cssreflections csstransforms csstransforms3d csstransitions fontface generatedcontent video audio localstorage sessionstorage webworkers applicationcache svg inlinesvg smil svgclippaths wf-brandongrotesque-i4-active wf-brandongrotesque-i7-active wf-brandongrotesque-n4-active wf-brandongrotesque-n7-active wf-dincondensedweb-n4-active wf-freightbigpro-i4-active wf-freightbigpro-i7-active wf-freightbigpro-n4-active wf-freightbigpro-n7-active wf-active">
+
 
<head>
 
<head>
  
<link rel="stylesheet" href="https://2015.igem.org/Team:CHINA_CD_UESTC/Template:RightStyle.css?action=raw&ctype=text/css" type="text/css" />
+
 
 
</head>
 
</head>
<style>
+
  <style>
.leftside{
+
color: #000;
+
float:left;
+
width:23%;
+
}
+
#page .leftside li a {
+
cursor:pointer;
+
color: #000;
+
}
+
 
+
.rightside{
+
float:left;
+
margin-left:5%;
+
width:72%;
+
height:500px; 
+
overflow-y:scroll;
+
}
+
.protocol{
+
display:none;
+
width:95%;
+
margin-bottom:20px;
+
}
+
.protocolactive{
+
display:block;
+
width:95%;
+
margin-bottom:20px;
+
}
+
 
+
table.tftable {font-size:12px;color:#333333;width:90%;border-width: 1px;border-color: #bcaf91;border-collapse: collapse;}
+
table.tftable th {font-size:12px;background-color:#ded0b0;border-width: 1px;padding: 8px;border-style: solid;border-color: #bcaf91;text-align:left;}
+
table.tftable tr {background-color:#ffffff;}
+
table.tftable td {font-size:12px;border-width: 1px;padding: 8px;border-style: solid;border-color: #bcaf91;}
+
  
 
</style>
 
</style>
  
 
+
  <style type="text/css">
<style type="text/css">
+
 
/*************************************************
 
/*************************************************
whole right section
+
        whole right section
  
 
***********************************************/
 
***********************************************/
 
#RightSection {
 
#RightSection {
position: fixed;
+
  position: fixed;
left: 260px;
+
  left: 260px;
top: 0;
+
  top: 0;
right: 0;
+
  right: 0;
height:100%;
+
  height:1200px;
background:#F0F0F0;
+
  background:#F0F0F0;
background-image:url("https://static.igem.org/mediawiki/2015/7/79/CHINA_CD_UESTC_NBbg.jpg");
+
  background-image:url("https://static.igem.org/mediawiki/2015/7/79/CHINA_CD_UESTC_NBbg.jpg");
overflow-y: scroll;
+
  overflow-y: scroll;
background-repeat: repeat;
+
  background-repeat: repeat;
background-size: 180px;
+
  background-size: 180px;
background-position:  
+
  background-position:  
  
transition: all 200ms ease-out;
+
  transition: all 200ms ease-out;
transform: translate3d(0, 0, 0);
+
  transform: translate3d(0, 0, 0);
z-index:1;
+
  z-index:1;
  
 
}
 
}
#firstTitle {
 
left:600px;
 
  
}
 
 
</style>
 
</style>
 +
 
<body id="homeIndexBody">
 
<body id="homeIndexBody">
<div id="RightSection"></div>
+
  <div id="RightSection"></div>
  
<div id="title">
+
  <div id="title">
 +
    <div id="firstTitle">
 +
      <p>
 +
        <B>PROTOCOL</B>
 +
      </p>
 +
    </div>
 +
  </div>
  
<div id="firstTitle"><p><B>PROTOCOL</B></p></div>
+
  <div id="RightContent">
</div>
+
    <div class="transparent_class ">
 +
      <p class="blockWords">
 +
        &nbsp;&nbsp;Here is our entire experimental standard used in the project. If you want to repeat our project, we propose to operate in accordance with these standards. Meanwhile, the application of these specific experiment standards has been presented on the Method page, if necessary, you can go and have a view.
 +
      </p>
 +
    </div>
  
<div id="RightContent">
+
    <div id="RightContentText">
<div class="transparent_class ">
+
<p class="blockWords">&nbsp;&nbsp;We are a skillful and persistent group of nine Finns. We started as a group of students who didn't really know each other, assuming that we were going to spend our summer studying synthetic biology with strange colleagues. In the end we got a bunch of new friends and (in addition to studying synthetic biology) we just might have spent one of the best summers of our lives.</p>
+
</div>
+
  
<div id="RightContentText">
+
      <div class="slide" id="slide2" data-slide="2" data-stellar-background-ratio="0.5" style="background-position: 0px 669px;">
 +
        <div class="container clearfix">
  
<div class="slide" id="slide2" data-slide="2" data-stellar-background-ratio="0.5" style="background-position: 0px 669px;">
+
          <div id="content" class="grid_12"> <strong><h2>Protocols</h2></strong>  
<div class="container clearfix">
+
          </div>
+
          <div class="clear"></div>
<div id="content" class="grid_12">
+
          <div id="content">
<strong><h2>Protocols</h2></strong>
+
            <div class="grid_8">
</div>
+
              <p>
<div class="clear"></div>
+
                In order to make our experiment can be repeated, we share our protocols to you responsibility.
+
                <br>Our protocols are divided into four parts,as follow:</p>
<div id="content">
+
            </div>
<div class="grid_8">
+
<h4>Biography</h4>
+
<p>Morbi rutrum, elit ac fermentum egestas, tortor ante vestibulum est, eget scelerisque nisl velit eget tellus. Fusce porta facilisis luctus. Integer neque dolor, rhoncus nec euismod eget, pharetra et tortor. Nulla id pulvinar nunc. Vestibulum auctor nisl vel lectus ullamcorper sed pellentesque dolor eleifend. Praesent lobortis magna vel diam mattis sagittis.</p>
+
</div>
+
  
<div class="clear"></div>
+
            <div class="clear"></div>
+
</div>
+
+
</div>
+
</div>
+
  
 +
          </div>
  
 +
        </div>
 +
      </div>
  
<div id="page">
+
      <div id="page">
  <div class="leftside">
+
        <div class="leftside">
    <ul>
+
          <ul>
      <li><a onclick="showprot('#prot1')">Heat Shock Transformation</a></li>
+
            <li>
      <li><a onclick="showprot('#prot2')">CaCl2 Competent Cells</a></li>
+
              <button class="button green larrow" onclick="showprot('#prot1')">Bacterial culture</button>
      <li><a onclick="showprot('#prot3')">Glycerol Stocks</a></li>
+
            </li>
    </ul>
+
            <li>
  </div>
+
              <button class="button green larrow" onclick="showprot('#prot2')">Molecular Biotechnology</button>
  <script type="text/javascript">
+
            </li>
 +
            <li>
 +
              <button class="button green larrow" onclick="showprot('#prot3')">Analysis method</button>
 +
            </li>
 +
            <li>
 +
              <button class="button green larrow" onclick="showprot('#prot4')">Reagent</button>
 +
            </li>
 +
 
 +
          </ul>
 +
        </div>
 +
        <script type="text/javascript">
 
     function showprot(pid){
 
     function showprot(pid){
 
       $(".protocolactive").each(function() {
 
       $(".protocolactive").each(function() {
Line 139: Line 119:
 
   };
 
   };
 
   </script>
 
   </script>
  <div class="rightside">
+
        <div class="rightside">
    <div id="prot1" class="protocolactive">
+
          <div id="prot1" class="protocolactive">
      <h2> Heat Shock Transformation of <i>E. coli</i></h2>
+
            <object data="https://static.igem.org/mediawiki/2015/5/52/CHINA_CD_UESTC_Protocol01.pdf" type="application/pdf" width="100%" height="580px">
      <p>This protocol can be used to transform chemically competent (i.e. from CaCl2) with a miniprepped plasmid or a ligation product.</p>
+
              <p>
      <h5>Note: Never vortex competent cells. Mix cells by gentle shaking.</h5>
+
                It appears you don't have a PDF plugin for this browser.
      <p><ol>
+
        No biggie... you can
  <li>Thaw competent cells on ice. These can be prepared using the CaCl2 protocol.</li>
+
                <a href="myfile.pdf">
  <li>Place 20 ul of cells in a pre-chilled Eppendorf tube.
+
                  click here to
    <ul>
+
        download the PDF file.
              <li><u>For an Intact Vector:</u> Add 0.5 ul or less to the chilled cells</li>
+
                </a>
              <li><u>For a Ligation Product:</u> Add 2-3 ul to the chilled cells.</li>
+
               </p>
    </ul>
+
            </object>
  </li>
+
          </div>
  <li>Mix gently by flicking the tube.</li>
+
  <li>Chill on ice for 10 minutes. <em>This step is optional, but can improve yields when transforming a ligation product.</em></li>
+
  <li>Heat shock at 42 &deg;C for 30 seconds.</li>
+
  <li>Return to ice for 2 minutes.</li>
+
  <li>Add 200 ul LB medium and recover the cells by shaking at 37 &deg;C.<br />
+
    Another rich medium can substitute for the recovery.<br />
+
    The recovery time varies with the antibiotic selection.<br />
+
    Ampicillin: 15-30 minutes<br />
+
    Kanamycin or Spectinomycin: 30-60 minutes<br />
+
    Chloramphenicol: 60-120 minutes
+
  </li>
+
  <li>Plate out the cells on selective LB.<br />
+
    Use glass beads to spread the cells.<br />
+
    The volume of cells plated depends on what is being transformed.<br />
+
    <ul>
+
               <li><u>For an Intact Vector:</u> High transformation efficiencies are expected. Plating out 10 ul of recovered cells should produce many colonies.</li>
+
              <li><u>For a Ligation Product:</u> Lower transformation efficiencies are expected. Therefore you can plate the entire 200 ul volume of recovered cells.</li>
+
    </ul>
+
    Note: 200 ul is the maximum volume of liquid that an LB plate can absorb.
+
  </li>
+
  <li>Incubate at 37 &deg;C. Transformants should appear within 12 hrs.</li>
+
      </ol></p>
+
    </div>
+
  
    <div id="prot2" class="protocol">
+
          <div id="prot2" class="protocol">
      <h2> CaCl2 Competent Cells </h2>
+
            <object data="https://static.igem.org/mediawiki/2015/2/26/CHINA_CD_UESTC_Protocol02.pdf" width="100%" height="580px">
      <p>This protocol makes 4 ml of competent cells, and can be easily scaled up to make more. The cells are typically stored in 110 ul aliquots, so this will make about 35 tubes. A typical transformation uses 20 ul of cells.</p>
+
              <p>
      <h5> Note: Never vortex competent cells. Resuspend by pipetting with large Pasteur pipettes.</h5>
+
                It appears you don't have a PDF plugin for this browser.
      <p><ol>
+
        No biggie... you can
  <li><b><u>The night before</b></u>, inoculate a 5 ml culture and grow overnight with selection.</li>
+
                <a href="myfile.pdf">
  <li> <b><u>The day of</b></u> the experiment dilute cells ~ 1:200 into selective media.<br>For this example add 250 ul to 50 ml of selective media.<br>Note: The protocol is easily scaled to increase the number of cells.</li>
+
                  click here to
  <li> Grow the cells to an OD600 of 0.6 – 0.7.
+
      download the PDF file.
    <br>Use a large flask, 500ml, for good aeration.
+
                </a>
    <br>Use a baffled flask for fastest growth.
+
              </p>
    <br>This takes about 3 hours depending on the cells.
+
            </object>
    <br>Medium-heavy cloudiness by eye is fine.</li>
+
          </div>
  <li>Spin down the cells at 4 ºC, 4000 rpm, 15 minutes.
+
    Note: Keep the cells at 4 ºC from now on.</li>
+
  <li>Resuspend cells in 15 ml, ice-cold 100 mM CaCl2.
+
    Leave on ice 4 hours to overnight.</li>
+
  <li>Spin down the cells at 4 ºC, 4000 rpm, 15 minutes.</li>
+
  <li>Resuspend cells in 4 ml, ice-cold 100 mM CaCl2 + 15% glycerol.</li>
+
  <li>Aliquot into pre-chilled Eppendorf tubes. Use immediately or store at -80ºC.<br />
+
    Note: Frozen cells are only good once.Do not refreeze cells once thawed.</li>
+
      </ol></p>
+
    </div>
+
  
    <div id="prot3" class="protocol">
+
          <div id="prot3" class="protocol">
      <h2>Glycerol Stocks </h2>
+
            <object data="https://static.igem.org/mediawiki/2015/2/2b/CHINA_CD_UESTC_Protocol03.pdf" width="100%" height="580px">
      <p><ol>
+
              <p>
  <li>Pick Single colonies from agar plates
+
                It appears you don't have a PDF plugin for this browser.
  <li>Innoculate 5ml LB broth overnight.
+
        No biggie... you can
  <li>Add 750ml of overnight culture to 250ml of 60% glycerol in a cryotube.
+
                <a href="myfile.pdf">
  <li>Make two sets of Glycerol stocks freeze one at -20ºC and the other at -80ºC.
+
                  click here to
      </ol></p>
+
        download the PDF file.
    </div>
+
                </a>
 +
              </p>
 +
            </object>
 +
          </div>
  
<!-- Row Highlight Javascript -->
+
          <div id="prot4" class="protocol">
<script type="text/javascript">
+
            <object data="https://static.igem.org/mediawiki/2015/1/12/CHINA_CD_UESTC_Protocol04.pdf" width="100%" height="580px">
  window.onload=function(){
+
              <p>
  var tfrow = document.getElementById('retable').rows.length;
+
                It appears you don't have a PDF plugin for this browser.
  var tbRow=[];
+
        No biggie... you can
  for (var i=1;i<tfrow;i++) {
+
                <a href="myfile.pdf">
    tbRow[i]=document.getElementById('retable').rows[i];
+
                  click here to
    tbRow[i].onmouseover = function(){
+
        download the PDF file.
    this.style.backgroundColor = '#f3f8aa';
+
                </a>
    };
+
              </p>
    tbRow[i].onmouseout = function() {
+
            </object>
    this.style.backgroundColor = '#ffffff';
+
          </div>
    };
+
        </div>
    }
+
    };
+
    </script>
+
  
<center>
+
      </div>
  <table id="retable" class="tftable" border="1">
+
      <div style="clear: both;"></div>
    <tr><th>Reagent</th><th>Volume (ul)</th></tr>
+
    <tr><td>Forward Primer</td><td>1.0</td></tr>
+
    <tr><td>Reverse Primer</td><td>1.0</td></tr>
+
    <tr><td>Template DNA</td><td>2.0</td></tr>
+
    <tr><td>Quick-Load Taq 2x Master Mix</td><td>10</td></tr>
+
    <tr><td>Nuclease-free water</td><td>6</td></tr>
+
    <tr><td>Total Volume</td><td>20</td></tr>
+
  </table>
+
</center>
+
<div style="clear: both;"></div>
+
      </p>
+
      <h3> Thermocycler Protocol: NEB Quick-Load</h3>
+
<script type="text/javascript">
+
  window.onload=function(){
+
  var tfrow = document.getElementById('nebtable').rows.length;
+
  var tbRow=[];
+
  for (var i=1;i<tfrow;i++) {
+
    tbRow[i]=document.getElementById('nebtable').rows[i];
+
    tbRow[i].onmouseover = function(){
+
    this.style.backgroundColor = '#f3f8aa';
+
    };
+
    tbRow[i].onmouseout = function() {
+
    this.style.backgroundColor = '#ffffff';
+
    };
+
    }
+
    };
+
    </script>
+
 
     </div>
 
     </div>
 +
    <!-- ########## Don't edit below ########## --> </div>
  
  </div>
+
</body>
  <div style="clear: both;"></div>
+
 
+
</div>
+
<!-- ########## Don't edit below ########## -->
+
 
+
 
+
</div>
+
</div>
+
</div>
+

Latest revision as of 16:15, 11 September 2015


<!DOCTYPE html>

PROTOCOL

  Here is our entire experimental standard used in the project. If you want to repeat our project, we propose to operate in accordance with these standards. Meanwhile, the application of these specific experiment standards has been presented on the Method page, if necessary, you can go and have a view.

Protocols

In order to make our experiment can be repeated, we share our protocols to you responsibility.
Our protocols are divided into four parts,as follow:

It appears you don't have a PDF plugin for this browser. No biggie... you can click here to download the PDF file.

It appears you don't have a PDF plugin for this browser. No biggie... you can click here to download the PDF file.

It appears you don't have a PDF plugin for this browser. No biggie... you can click here to download the PDF file.

It appears you don't have a PDF plugin for this browser. No biggie... you can click here to download the PDF file.