{"id":13961,"date":"2023-12-19T09:36:09","date_gmt":"2023-12-19T14:36:09","guid":{"rendered":"https:\/\/legacy.coreconcepts.design\/?p=13961"},"modified":"2024-03-26T12:03:34","modified_gmt":"2024-03-26T16:03:34","slug":"%cf%80%cf%8e%cf%82-%ce%bd%ce%b1-%ce%b4%ce%b7%ce%bc%ce%b9%ce%bf%cf%85%cf%81%ce%b3%ce%ae%cf%83%ce%b5%cf%84%ce%b5-%cf%86%ce%bf%ce%b2%ce%b5%cf%81%ce%ad%cf%82-%cf%80%cf%81%ce%bf%cf%84%cf%81%ce%bf%cf%80","status":"publish","type":"post","link":"https:\/\/legacy.coreconcepts.design\/gr\/%cf%80%cf%8e%cf%82-%ce%bd%ce%b1-%ce%b4%ce%b7%ce%bc%ce%b9%ce%bf%cf%85%cf%81%ce%b3%ce%ae%cf%83%ce%b5%cf%84%ce%b5-%cf%86%ce%bf%ce%b2%ce%b5%cf%81%ce%ad%cf%82-%cf%80%cf%81%ce%bf%cf%84%cf%81%ce%bf%cf%80\/","title":{"rendered":"\u03a0\u03ce\u03c2 \u03bd\u03b1 \u03b4\u03b7\u03bc\u03b9\u03bf\u03c5\u03c1\u03b3\u03ae\u03c3\u03b5\u03c4\u03b5 \u03c6\u03bf\u03b2\u03b5\u03c1\u03ad\u03c2 \u03c0\u03c1\u03bf\u03c4\u03c1\u03bf\u03c0\u03ad\u03c2 ChatGPT;"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"13961\" class=\"elementor elementor-13961\" data-elementor-post-type=\"post\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-b79d172 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"b79d172\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;jet_parallax_layout_list&quot;:[]}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-01ee710\" data-id=\"01ee710\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-c081d4b elementor-widget elementor-widget-text-editor\" data-id=\"c081d4b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p><span style=\"font-weight: 400;\">Before you get started using the AI tool, there are a few best practices that apply when asking ChatGPT questions:<\/span><\/p><ul><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Be specific;<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Provide context;<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Use role play;<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Use double quotes;<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Give examples;<\/span><\/li><\/ul><p>By following these tips, you can ensure you&#8217;re using the bot as effectively as possible<\/p><p>What\u2019s Inside:<\/p><ol><li>Web Development Architecture Prompts<\/li><li>HTML and Markdown Prompts<\/li><li>CSS Prompts<\/li><li>JavaScript Prompts<\/li><li>Security Prompts<\/li><li>Code Debugging &amp; Optimization Prompts<\/li><\/ol><p>Let&#8217;s explore the transformative power of ChatGPT prompts in web development and beyond!<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4af5a7e elementor-widget elementor-widget-heading\" data-id=\"4af5a7e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Web Development Architecture Prompts<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e620a0a elementor-widget elementor-widget-text-editor\" data-id=\"e620a0a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p><span style=\"font-weight: 400;\">Using ChatGPT you can create a powerful structure for your web project. Use the following prompts and modify them with the specifications of your project.<\/span><\/p><ul><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Develop an architecture and code for a &lt; description &gt; website for Javascript<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Act as a software developer. Come up with an architecture and code for developing an [attorney] website with scheduling features using HTML.<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">I\u2019m making a website for a small business that sells handmade soaps. Provide ideas on how to structure the website using WordPress.<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Develop an architecture and code for a web-based project management tool that allows users to collaborate on tasks and projects.<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Can you suggest some libraries or frameworks for developing [specific type of application]?<\/span><\/li><\/ul>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4acb62c elementor-widget elementor-widget-heading\" data-id=\"4acb62c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">HTML and Markdown Prompts<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-31d7ec7 elementor-widget elementor-widget-text-editor\" data-id=\"31d7ec7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p><span style=\"font-weight: 400;\">HTML is the first step in learning to become a developer. With ChatGPT, this step can become even easier. Check the prompts below.<\/span><\/p><ul><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">In a table, list shortcuts for [HTML\/ VS Code\/React\/Python] using an Apple or Windows device.<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Write a cheat sheet for markdown formatting<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Write an HTML code for a form that collects a user&#8217;s name, email, and phone number.<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Write a Markdown document that includes headings, paragraphs, bullet points, and a hyperlink.<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Make the following image gallery code responsive in HTML &lt; insert code &gt;<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Can you provide an HTML code snippet that creates a button with a hover effect and a link to the following page [insert URL]<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Act as a web developer. Generate a [number] by [number] grid of HTML divs with a [color] background.<\/span><\/li><\/ul>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e510a1e elementor-widget elementor-widget-heading\" data-id=\"e510a1e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">CSS Prompts\n<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6707b21 elementor-widget elementor-widget-text-editor\" data-id=\"6707b21\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p><span style=\"font-weight: 400;\">Same as HTML, by leveraging the platform&#8217;s natural language processing capabilities, you can work with CSS faster than ever. You can find CSS code examples, analyse them, and improve your skills.<\/span><\/p><ul><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">I want to implement a navbar on my website. Can you provide an example using CSS and Javascript?<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">List web browser compatibility for CSS Grid.<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Give a code demo using Flexbox.<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Show me how I can create a responsive menu using only CSS?<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Show me how I can create a gradient background using CSS?<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Show me how to create a CSS animation for a button when it is hovered over.<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Act as a web developer. Write HTML and CSS code for a [specific type of web page], with [specific features].<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Recommend a CSS framework for [specific project].<\/span><\/li><\/ul>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7af1a9f elementor-widget elementor-widget-heading\" data-id=\"7af1a9f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">JavaScript Prompts<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-2663d29 elementor-widget elementor-widget-text-editor\" data-id=\"2663d29\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p><span style=\"font-weight: 400;\">If you are using Javascript, you can ask ChatGPT to generate code for a specific function or to solve a particular bug in your code. Check the following prompts and adapt them to your needs.<\/span><\/p><ul><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Please continue writing this code for Javascript &lt; insert code &gt;<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Act as a JavaScript Developer, write a program that checks the information on a form. Name and phone number are required, but email address and age are not.<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Detect memory leaks in the following JavaScript code &lt; insert code &gt;<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Switch from [React] to [Vuejs] the following code: &lt; insert code &gt;<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Develop a JavaScript application that retrieves data from a public API and displays it on a webpage.<\/span><\/li><\/ul>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-bd8c284 elementor-widget elementor-widget-heading\" data-id=\"bd8c284\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Security Prompts<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-48f2e08 elementor-widget elementor-widget-text-editor\" data-id=\"48f2e08\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p><span style=\"font-weight: 400;\">Assuring your application is secure is a highly important step in your development. See how ChatGPT can help you.<\/span><\/p><ul><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Discover the security flaw in this code snippet from an open-source npm package<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Show me step by step how I can implement HTTPS on my website<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Show me how I can implement 2FA to my website<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">As a cyber security specialist. You will be provided with specific details regarding how the data is stored and shared, and your task will be to propose suitable measures to secure this data from malicious actors. This may involve recommending [insert].<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Write a secure [language] function or module that performs [specific task or operation] while preventing [security threat or vulnerability].<\/span><\/li><\/ul>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7ff1ffc elementor-widget elementor-widget-heading\" data-id=\"7ff1ffc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Code Debugging &amp; Optimization Prompts\n<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-07ae557 elementor-widget elementor-widget-text-editor\" data-id=\"07ae557\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p><span style=\"font-weight: 400;\">Assuring your application is secure is a highly important step in your development. See how ChatGPT can help you.<\/span><\/p><ul><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Suggest ways to optimize the following function &lt; insert function &gt;<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">&lt; insert code &gt; The above code is not running. Could you tell me what the problem might be?<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Act as a senior web developer. Could you please refactor the following code &lt; insert code &gt;<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">&lt; insert code &gt; Could you tell me some test cases to test the above code?<\/span><\/li><li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">Write a secure [language] function or module that performs [specific task or operation] while preventing [security threat or vulnerability].<\/span><\/li><\/ul>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Before you get started using the AI tool, there are a few best practices that apply when asking ChatGPT questions: Be specific; Provide context; Use role play; Use double quotes; Give examples; By following these tips, you can ensure you&#8217;re using the bot as effectively as possible What\u2019s Inside: Web Development Architecture Prompts HTML and [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":13966,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[57],"tags":[],"class_list":["post-13961","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tech-tips"],"acf":[],"_links":{"self":[{"href":"https:\/\/legacy.coreconcepts.design\/gr\/wp-json\/wp\/v2\/posts\/13961","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/legacy.coreconcepts.design\/gr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/legacy.coreconcepts.design\/gr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/legacy.coreconcepts.design\/gr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/legacy.coreconcepts.design\/gr\/wp-json\/wp\/v2\/comments?post=13961"}],"version-history":[{"count":0,"href":"https:\/\/legacy.coreconcepts.design\/gr\/wp-json\/wp\/v2\/posts\/13961\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/legacy.coreconcepts.design\/gr\/wp-json\/wp\/v2\/media\/13966"}],"wp:attachment":[{"href":"https:\/\/legacy.coreconcepts.design\/gr\/wp-json\/wp\/v2\/media?parent=13961"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/legacy.coreconcepts.design\/gr\/wp-json\/wp\/v2\/categories?post=13961"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/legacy.coreconcepts.design\/gr\/wp-json\/wp\/v2\/tags?post=13961"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}