-
Devyani Ravi authoredDevyani Ravi authored
Contribution.vue 9.45 KiB
<template>
<div class="contribution">
<h3>Connecting iGEM Past, Present, and Future</h3>
<div class="contribution-container">
<img
src="https://static.igem.wiki/teams/5306/contribution/contributionscutiesgood.webp"
alt="Contribution Image"
width="300"
/>
<p>
Our team, MSP-Maastricht, is dedicated to being an active and ongoing contributor to the iGEM community. We believe that science and engineering bridge the past and future, as all research builds on the knowledge of those who came before us. A key part of this tradition is our Contributions page, which showcases the innovative solutions we are developing to tackle real-world challenges. By sharing our strategies, methodologies, and findings, we aim to enhance the accessibility and application of synthetic biology techniques. Through facilitating such knowledge transfer, we hope to benefit future iGEM teams and the broader SynBio community.
</p>
</div>
<h3>Our Specific Contributions</h3>
<!-- Collapsible Cards -->
<div class="collapsible-cards">
<!-- Vibrio Natriegens Protocol Booklet -->
<div class="card">
<h4 @click="toggleSection('protocolGuide')">
Vibrio natriegens Protocol Booklet
<span v-if="sections.protocolGuide">▲</span>
<span v-else>▼</span>
</h4>
<div v-if="sections.protocolGuide" class="content">
<p>
With the growing popularity of <i>Vibrio natriegens</i> as a chassis organism and its relatively new use within synthetic biology and iGEM, the consolidation of protocols is crucial. To fulfill this need, we aim to provide future iGEM teams a strong foundation to build upon through our comprehensive protocol guide for <i>Vibrio natriegens</i>. This guide will provide step-by-step instructions on obtaining, culturing, manipulating, and utilizing <i>Vibrio natriegens</i>, making it easier for other researchers to adopt this organism in their work. Additionally, the guide also includes tips and tricks we have learned through our experience working with this novel bacterium. By providing this resource, we hope to save teams valuable time and effort during the competition and beyond.
</p>
<p>
For more detailed information, you can download our comprehensive booklet:
<a href="https://static.igem.wiki/teams/5306/contribution/the-maastricht-booklet.pdf" target="_blank" rel="noopener noreferrer">
The Maastricht Booklet
</a>.
</p>
</div>
</div>
<!-- Vibrio Natriegens Snapgene Codon Optimization Table -->
<div class="card">
<h4 @click="toggleSection('codonTable')">
Vibrio natriegens Snapgene Codon Optimization Table
<span v-if="sections.codonTable">▲</span>
<span v-else>▼</span>
</h4>
<div v-if="sections.codonTable" class="content">
<p>
In addition to our protocol guide, Natronaut has created an easily accessible codon optimization table specifically for <i>Vibrio natriegens</i> that can be directly used in Snapgene. This table will assist researchers in selecting the most efficient codons for gene expression, optimizing the performance of genetic constructs, and improving experimental outcomes for future teams working with <i>Vibrio natriegens</i>.
</p>
<img
src="https://static.igem.wiki/teams/5306/contribution/codon-opt-table.webp"
alt="Codon Optimization Table"
width="100%"
/>
<!-- Download Section -->
<div class="download-section">
<h4>Download the Codon Optimization Table</h4>
<button @click="downloadTable">Download Codon Optimization Table</button>
</div>
<!-- Additional Text Section -->
<p>
To download the <i>Vibrio natriegens</i> codon optimization table for use in Snapgene click on the button above. Once downloaded, select the xml file in your downloads. From here you can chose to open the xml file with straight into Snapgene and just in these few clicks you are ready for codon optimization.
</p>
</div>
</div>
<!-- Registry Parts -->
<div class="card">
<h4 @click="toggleSection('registryParts')">
Registry Parts
<span v-if="sections.registryParts">▲</span>
<span v-else>▼</span>
</h4>
<div v-if="sections.registryParts" class="content">
<p>
Our team has registered new parts in the iGEM registry, aiming to facilitate research using the ANRA pathway with or without <i>Vibrio Natriegens</i>. ADD DETAILS OF THE PARTS THEMSELVES: TYPE EG. BASIC, COMPOSITE WITH NUMBER. By the registry of these parts, we aim to further expand the accessibility of such parts for future iGEM teams that wish to work with the assimilatory nitrate reduction to ammonium (ANRA) pathway without or with <i>Vibrio Natriegens</i> as a chassis organism. Parts also come with characterization which can aid and provide a starting point for future teams. Furthermore, we wish for such future iGEM teams to continue to characterize and build upon these newly registered iGEM parts with their own findings, truly setting the foundations for collaboration.
DO A TABLE WITH OUR CATEGORIES OF PARTS AND THEIR NUMBERS
For detailed information about Natronaut's parts please refer to the Engineering and Parts pages. LINK
</p>
</div>
</div>
<!-- Sustainable Development Booklet -->
<div class="card">
<h4 @click="toggleSection('sustainableBooklet')">
Sustainable Development Booklet
<span v-if="sections.sustainableBooklet">▲</span>
<span v-else>▼</span>
</h4>
<div v-if="sections.sustainableBooklet" class="content">
<p>
Sustainability is an integral part that is inherently integrated into our project. Given our experience in this area, Natronaut is currently developing a Sustainable Development Booklet. This booklet will share our experiences with the community, as an outline for how iGEM projects can align with global sustainability goals
</p>
</div>
</div>
<!-- Notion Organisation Template -->
<div class="card">
<h4 @click="toggleSection('notionTemplate')">
Notion Organisation Template
<span v-if="sections.notionTemplate">▲</span>
<span v-else>▼</span>
</h4>
<div v-if="sections.notionTemplate" class="content">
<p>
Based on our experience, organization and management are foundational to a successful project. To help future iGEM teams organize and manage their projects effectively and seamlessly, we have created a Notion template that our team has personally used within our project.
</p>
</div>
</div>
</div>
<h3>Conclusion</h3>
<p>
Together, these contributions aim to empower future researchers, especially iGEM teams, promote the responsible use of synthetic biology, and facilitate advancements in addressing pressing environmental issues. We believe that sharing our insights and tools will not only enhance our own project but also benefit the global iGEM community and beyond.
</p>
</div>
</template>
<script>
export default {
name: "Contribution",
data() {
return {
sections: {
protocolGuide: false,
codonTable: false,
registryParts: false,
sustainableBooklet: false,
notionTemplate: false
}
};
},
methods: {
toggleSection(section) {
this.sections[section] = !this.sections[section];
},
downloadTable() {
// Define the XML content for the codon optimization table
const xmlContent = `<?xml version="1.0" encoding="UTF-8"?>
<CodonUsageTables>
<UsageTable type="C" name="Vibrio Natriegens" geneticCode="1" frequencies="GCG:0.27;ATC:0.41;CTG:0.22;ACG:0.23;CCA:0.39;AGC:0.19;CGG:0.03;TTC:0.4;AGG:0.03;GAT:0.6;CCT:0.31;GAA:0.65;GGT:0.45;GGC:0.32;ATG:1;TCG:0.12;CGT:0.42;TAG:0.19;CAA:0.59;TTT:0.59;TGA:0.15;CGC:0.26;CTT:0.18;CAC:0.49;CCG:0.22;ACA:0.22;AAT:0.43;TAA:0.65;AAG:0.31;ATA:0.1;CAG:0.41;GTT:0.33;ATT:0.48;GTG:0.25;GGA:0.12;TGG:1;GCT:0.26;CGA:0.14;GGG:0.09;GAG:0.34;TAC:0.56;GTA:0.22;AAC:0.56;TCC:0.07;GAC:0.39;TAT:0.43;CTA:0.13;AGA:0.1;GTC:0.18;TGT:0.66;TGC:0.33;TTA:0.31;CAT:0.3;AAC:0.57;CAG:0.47;TGT:0.58;TCG:0.14;CCG:0.26;AAG:0.22;CGA:0.31;CTC:0.21;ACA:0.19;TCC:0.22" />
</CodonUsageTables>`;
// Create a blob from the XML content
const blob = new Blob([xmlContent], { type: "text/xml" });
const url = URL.createObjectURL(blob);
// Create a link to download the file
const a = document.createElement("a");
a.href = url;
a.download = "Vibrio_Natriegens_Codon_Optimization_Table.xml";
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
URL.revokeObjectURL(url);
}
}
};
</script>
<style scoped>
.contribution {
padding: 20px;
}
.contribution-container {
display: flex;
align-items: center;
}
.collapsible-cards {
margin-top: 20px;
flex-direction: column;
gap: 20px;
margin: 20px 0;
}
.card {
background-color: #e3f2fd;
border: 1px solid #ccc;
border-radius: 5px;
margin-bottom: 10px;
padding: 20px;
}
.card h4 {
cursor: pointer;
margin: 0;
display: flex;
justify-content: space-between;
}
.content {
padding: 10px 0;
}
h1, h3 {
color: #396d7e;
}
.download-section {
margin-top: 10px;
}
</style>