File manager

File manager - Edit - /home/kridsana/webapp.cm.in.th/663012801/u66301280015/portfolios/Home.html

Back
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" /> <title>นรบดินทร์ นุชทรวง - Portfolios</title> <link rel="stylesheet" href="style.css"> <link rel="icon" type="image/x-icon" href="./image/Logo.png"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css" integrity="sha512-Evv84Mr4kqVGRNSgIGL/F/aIDqQb7xQ2vcrdIwxfjThSH8CSR7PBEakCr51Ck+w+/U6swU2Im1vVX0SVk9ABhg==" crossorigin="anonymous" referrerpolicy="no-referrer" /> <link rel="stylesheet" type='text/css' href="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/devicon.min.css" /> <script defer src="./Javascript/dropdownmenu.js"></script> <script defer src="./Javascript/activelink.js"></script> </head> <body> <!-- Navigation bar --> <nav class="nav-bar"> <div class="nav-bar-logo"> <a href="#short-data-section1"><img src="./image/Logo.png" alt="Logo" width="40" height="40"></a> </div> <ul class="nav-bar-menu"> <li><a href="#short-data-section1" class="nav-link active-link">หน้าแรก</a></li> <li><a href="#aboutme-section2" class="nav-link">เกี่ยวกับฉัน</a></li> <li><a href="#project-section3" class="nav-link">โปรเจค</a></li> <li><a href="#contact-section4" class="nav-link">ติดต่อ</a></li> </ul> <div class="toggle-btn"> <i class="fa-solid fa-bars"></i> </div> <ul class="dropdown-menu"> <li><a href="#short-data-section1">หน้าแรก</a></li> <li><a href="#aboutme-section2">เกี่ยวกับฉัน</a></li> <li><a href="#project-section3">โปรเจค</a></li> <li><a href="#contact-section4">ติดต่อ</a></li> </ul> </nav> <!-- Navigation bar --> <!-- หน้าแรก --> <section class="short" id="short-data-section1"> <div class="short-grid"> <div class="short-data"> <img src="./image/Profile.jpg" alt="profile"> </div> <div class="short-data"> <div class="short-data-write"> <h3 class="short-hello">สวัสดี, ผมเอง</h3> <h1 class="short-name"><span class="shorth-name-ightlight">นายนรบดินทร์ นุชทรวง</span></h1> <h4 class="short-role">ผมเป็น <span class="type" style="--n:10"> <span> <span>Web Developer</span> <span>Full-Stack Developer</span> <span>Network Engineer</span> <span>IoT Developer</span> <span>UX/UI Designer</span> <span>IT Support</span> <span>Art Designer</span> <span>Astrophotography</span> <span>Photographer</span> <span>Video Editor</span> </span> </span> </h4> </div> </div> </div> </section> <!-- หน้าแรก --> <!-- Marquee Logo --> <section class="marquee-logo"> <!-- <h1 class="marquee-logo-h1">TEST</h1> --> <div class="marquee-wrapper"> <div class="marquee-item item1"> <img src="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/html5/html5-original.svg"/> </div> <div class="marquee-item item2"> <img src="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/css3/css3-original.svg"/> </div> <div class="marquee-item item3"> <img src="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/php/php-original.svg"/> </div> <div class="marquee-item item4"> <img src="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/javascript/javascript-original.svg"/> </div> <div class="marquee-item item5"> <img src="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/cplusplus/cplusplus-original.svg"/> </div> <div class="marquee-item item6"> <img src="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/azuresqldatabase/azuresqldatabase-original.svg"/> </div> <div class="marquee-item item7"> <img src="./image/arduino.svg"/> </div> <div class="marquee-item item8"> <img src="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/vscode/vscode-original.svg"/> </div> <div class="marquee-item item9"> <img src="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/filezilla/filezilla-original.svg" /> </div> <div class="marquee-item item10"> <img src="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/ssh/ssh-original-wordmark.svg" /> </div> <div class="marquee-item item11"> <img src="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/debian/debian-original-wordmark.svg"/> </div> <div class="marquee-item item12"> <img src="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/bash/bash-original.svg"/> </div> <div class="marquee-item item13"> <img src="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/apache/apache-original-wordmark.svg"/> </div> <div class="marquee-item item14"> <img src="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/mariadb/mariadb-original-wordmark.svg"/> </div> <div class="marquee-item item15"> <img src="./image/illustrator.svg"/> </div> <div class="marquee-item item16"> <img src="./image/photoshop.svg"/> </div> <div class="marquee-item item17"> <img src="./image/premiere-pro.svg"/> </div> </div> </section> <!-- Marquee Logo --> <!-- เกี่ยวกับฉัน --> <section class="aboutme" id="aboutme-section2"> <div class="aboutme-text"> <h1 class="aboutme-h1">เกี่ยวกับฉัน</h1> <p class="aboutme-p">ผมเป็นคนที่มีความสนใจในหลากหลายด้าน ทั้งเทคโนโลยี การออกแบบ และงานสร้างสรรค์ ผมหลงใหลในการพัฒนาเว็บไซต์ การทำระบบ Full-Stack และการออกแบบ UX/UI ควบคู่ไปกับการศึกษาเรื่องเครือข่ายและ IoT เพื่อเชื่อมต่ออุปกรณ์และพัฒนาโซลูชันที่ใช้งานได้จริง นอกจากนี้ ผมยังมีความสนใจในงานศิลปะ การถ่ายภาพ และการตัดต่อวิดีโอ ซึ่งช่วยให้ผมสามารถผสมผสานเทคโนโลยีกับความคิดสร้างสรรค์ได้อย่างลงตัว<br><br> ผมเป็นคนที่ชอบเรียนรู้และทดลองสิ่งใหม่ ๆ ไม่ว่าจะเป็นการพัฒนาแอปพลิเคชัน การออกแบบประสบการณ์ผู้ใช้ หรือการสร้างสื่อดิจิทัล ผมมองว่าเทคโนโลยีและศิลปะสามารถทำงานร่วมกันได้ และผมต้องการนำความรู้เหล่านี้ไปพัฒนาโซลูชันที่สามารถช่วยแก้ปัญหาหรือสร้างประโยชน์ให้กับสังคม<br><br> การเรียนต่อในระดับมหาวิทยาลัยถือเป็นโอกาสสำคัญที่ผมจะได้ต่อยอดความรู้และพัฒนาทักษะของตัวเองให้ลึกซึ้งยิ่งขึ้น ผมเชื่อว่าความสามารถที่หลากหลายของผมจะช่วยให้ผมสามารถสร้างสรรค์สิ่งใหม่ ๆ ที่มีคุณค่า และเป็นส่วนหนึ่งของการพัฒนานวัตกรรมในอนาคต</p> </div> <div class="synopsis-education"> <h1 class="synopsis-education-h1">🏫 การศึกษา 🏫</h1> <br> <div class="synopsis-education-eachlevel"> <p class="synopsis-education-p">โรงเรียนอนุบาลเชียงใหม่</p> <p>🎓 ปี พ.ศ. 2552 - 2560 🎓</p> </div> <div class="synopsis-education-eachlevel"> <p class="synopsis-education-p">โรงเรียนยุพราชวิทยาลัย</p> <p>🎓 ปี พ.ศ. 2560 - 2563 🎓</p> </div> <div class="synopsis-education-eachlevel"> <p class="synopsis-education-p">วิทยาลัยเทคนิคเชียงใหม่ (ปวช.)</p> <p>(สาขาวิชาอิเล็กทรอนิกส์ สาขางานเทคนิคคอมพิวเตอร์)</p> <p>🎓 ปี พ.ศ. 2563 - 2566 🎓</p> </div> <div class="synopsis-education-eachlevel"> <p class="synopsis-education-p">วิทยาลัยเทคนิคเชียงใหม่ (ปวส.)</p> <p>(สาขาวิชาเทคโนโลยีคอมพิวเตอร์ สาขางานคอมพิวเตอร์ระบบเครือข่าย)</p> <p>🎓 ปี พ.ศ. 2566 - 2568 🎓</p> </div> </div> <div class="synopsis-experience"> <h1 class="synopsis-experience-h1">💼 ประสบการณ์ 💼</h1> <br> <div class="synopsis-experience-all"> <p class="synopsis-experience-p">SAK COMPUTER</p> <p>ตำแหน่ง: ซ่อมคอมพิวเตอร์, โน็ตบุ๊ค, ติดตั้งอินเตอร์เน็ต, ซ่อมเครื่องถ่ายเอกสาร, ส่งเคลมประกัน</p> <p>📅 ตุลาคม 2565 - กุมภาพันธ์ 2566 (ปวช.) 📅</p> </div> <div class="synopsis-experience-all"> <p class="synopsis-experience-p">การไฟฟ้าส่วนภูมิภาค เขต 1 (ภาคเหนือ) จังหวัดเชียงใหม่</p> <p>ตำแหน่ง: IT Support, Electronics Technician</p> <p>📅 กุมภาพันธ์ 2567 - เมษายน 2567 (ปวส.) 📅</p> </div> </div> <div class="synopsis-skill"> <h1 class="synopsis-skill-h1">⚙️ ความสามารถ / Skill ⚙️</h1> <br> <div class="synopsis-skill-all"> <p class="synopsis-skill-p">Web Developer</p> </div> <div class="synopsis-skill-all"> <p class="synopsis-skill-p">Full-Stack Developer</p> </div> <div class="synopsis-skill-all"> <p class="synopsis-skill-p">Network Engineer</p> </div> <div class="synopsis-skill-all"> <p class="synopsis-skill-p">IoT Developer</p> </div> <div class="synopsis-skill-all"> <p class="synopsis-skill-p">UX/UI Designer</p> </div> <div class="synopsis-skill-all"> <p class="synopsis-skill-p">IT Support</p> </div> <div class="synopsis-skill-all"> <p class="synopsis-skill-p">Art Designer</p> </div> <div class="synopsis-skill-all"> <p class="synopsis-skill-p">Astrophotography</p> </div> <div class="synopsis-skill-all"> <p class="synopsis-skill-p">Photographer</p> </div> <div class="synopsis-skill-all"> <p class="synopsis-skill-p">Video Editor</p> </div> </div> <div class="synopsis-skill-bar-lang"> <h1 class="synopsis-skill-bar-lang-h1">🌍 ทักษะด้านภาษา 🌍</h1> <br> <div class="synopsis-skill-bar-lang-all"> <p class="synopsis-skill-bar-lang-all-p">ภาษาไทย</p> <p class="synopsis-skill-bar-lang-all-p">80%</p> <div class="skill-bar-lang thai"> <div class="skill-bar-level-lang" style="width:80%;"></div> </div> </div> <div class="synopsis-skill-bar-lang-all"> <p class="synopsis-skill-bar-lang-all-p">ภาษาอังกฤษ</p> <p class="synopsis-skill-bar-lang-all-p">65%</p> <div class="skill-bar-lang eng"> <div class="skill-bar-level-lang" style="width:55%;"></div> </div> </div> </div> <div class="synopsis-skill-bar-program"> <h1 class="synopsis-skill-bar-program-h1">🖥️ ทักษะด้านการเขียนโปรแกรม 🖥️</h1> <br> <div class="synopsis-skill-bar-program-all"> <p class="synopsis-skill-bar-program-all-p">HTML</p> <p class="synopsis-skill-bar-program-all-p">75%</p> <div class="skill-bar-program html"> <div class="skill-bar-level-program" style="width:75%;"></div> </div> </div> <div class="synopsis-skill-bar-program-all"> <p class="synopsis-skill-bar-program-all-p">CSS</p> <p class="synopsis-skill-bar-program-all-p">55%</p> <div class="skill-bar-program css"> <div class="skill-bar-level-program" style="width:55%;"></div> </div> </div> <div class="synopsis-skill-bar-program-all"> <p class="synopsis-skill-bar-program-all-p">PHP</p> <p class="synopsis-skill-bar-program-all-p">65%</p> <div class="skill-bar-program php"> <div class="skill-bar-level-program" style="width:65%;"></div> </div> </div> <div class="synopsis-skill-bar-program-all"> <p class="synopsis-skill-bar-program-all-p">Javascript</p> <p class="synopsis-skill-bar-program-all-p">35%</p> <div class="skill-bar-program javascript"> <div class="skill-bar-level-program" style="width:35%;"></div> </div> </div> <div class="synopsis-skill-bar-program-all"> <p class="synopsis-skill-bar-program-all-p">C++</p> <p class="synopsis-skill-bar-program-all-p">60%</p> <div class="skill-bar-program cpp"> <div class="skill-bar-level-program" style="width:60%;"></div> </div> </div> <div class="synopsis-skill-bar-program-all"> <p class="synopsis-skill-bar-program-all-p">SQL</p> <p class="synopsis-skill-bar-program-all-p">85%</p> <div class="skill-bar-program sql"> <div class="skill-bar-level-program" style="width:85%;"></div> </div> </div> </div> <div class="tool-use"> <h1 class="tool-use-h1">🛠️ TOOLS 🛠️</h1> <div class="tool-use-container"> <div class="tool-use-column"> <img src="./image/arduino.svg" alt="Arduino"> <p>Arduino IDE</p> </div> <div class="tool-use-column"> <img src="./image/vscode.svg" alt="Vscode"> <p>Visual Studio Code</p> </div> <div class="tool-use-column"> <img src="./image/filezilla.svg" alt="Filezilla"> <p>Filezilla</p> </div> <div class="tool-use-column"> <img src="./image/illustrator.svg" alt="Illustrator"> <p>Adobe Illustrator</p> </div> <div class="tool-use-column"> <img src="./image/photoshop.svg" alt="Photoshop"> <p>Adobe Photoshop</p> </div> <div class="tool-use-column"> <img src="./image/premiere-pro.svg" alt="Premiere Pro"> <p>Adobe Premiere Pro</p> </div> </div> </div> </section> <!-- เกี่ยวกับฉัน --> <!-- โปรเจค --> <section class="project-background" id="project-section3"> <h1 class="project-background-h1">🔗 โปรเจค 🔗</h1> <div class="project-container"> <div class="project-container-column"> <div class="project-image-container"> <img src="./image/Website-1-Profile.png" alt="Website Dufoon"> </div> <div class="project-content"> <div class="project-content-title"> Dufoon<br> สถานีเตือนภัยวิกฤตฝุนละออง<br>ในอากาศในพื้นที่ชุมชน<br> </div> <div class="project-content-description"> สิ่งประดิษฐนี้มุ่งเน้นการพัฒนา <br>ระบบเตือนภัยมลพิษทาง อากาศในชุมชน และเทคโนโลยี NB IoT <br>สำหรับการส่งข้อมูล บนคลาวด์อย่างมีประสิทธิภาพ การแจ้งเตือนแบบเรียลไทม์จะ ส่งผานบัญชีทางการของ LINE OA และแสดงข้อมูลบน เว็บไซต์ Dufoon.cm.in.th<br><br> ตำแหน่ง: Web Developer, <br>IoT Developer, <br>Full-Stack Developer <br><br> ได้รางวัลรองชนะเลิศระดับจังหวัด<br> ได้รางวัลรองชนะเลิศระดับภาคเหนือ<br> ได้รางวัล Honor Awards ระดับเหรียญทอง </div> </div> <a href="https://dufoon.cm.in.th" class="project-btn web">เข้าสู่เว็บไซต์</a> <a class="project-btn img" onclick="openPopup()">ดูรูปเพิ่มเติม</a> <div id="errorMessage" class="project-image-error"></div> <div class="project-popup" id="project-imagePopup"> <span class="project-close" onclick="closePopup()">×</span> <button class="project-prev" onclick="changeImage(-1)">❮</button> <img id="project-popupImage" src="" alt="Popup Image" onerror="handlePopupImageError()"> <button class="project-next" onclick="changeImage(1)">❯</button> <div id="project-imageCounter" class="project-image-counter">1 / 3</div> </div> <script defer src="./Javascript/imageshow.js"></script> </div> </div> </section> <!-- โปรเจค --> <!-- ติดต่อ --> <section class="contact" id="contact-section4"> <h1 class="contact-container-h1">🌐 ช่องทางติดต่อ 🌐</h1> <div class="contact-container"> <div class="contact-container-column"> <p><i class="fa-brands fa-facebook"></i></p> <p>Facebook</p> <p>นรบดินทร์ นุชทรวง</p> </div> <div class="contact-container-column"> <p><i class="fa-solid fa-phone"></i></p> <p>เบอร์โทร</p> <p>080-053-1400</p> </div> <div class="contact-container-column"> <p><i class="fa-solid fa-envelope"></i></p> <p>Email</p> <p>guitar444888@gmail.com</p> </div> </div> <p class="footer">© Copyright 2025 All Rights Reserved</p> </section> <!-- ติดต่อ --> <!-- Loading page --> <div class="loader-screen"> <div class="lds-roller"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div> </div> <script defer src="./Javascript/loadingpage.js"></script> <!-- Loading page --> </body> </html>

| ver. 1.4 | Github | . | PHP 7.4.33 | Generation time: 0.78 | proxy | phpinfo | Settings