由于一个完整的App涉及多个部分（如前端、后端、数据库等），并且不同平台（如iOS、Android、Web）使用不同的技术和工具，所以在这里我将提供一个非常简化的示例，用几种不同的编程语言来展示如何开

最新推荐文章于 2024-07-24 23:00:08 发布

CrystalLawson

最新推荐文章于 2024-07-24 23:00:08 发布

阅读量308

点赞数 4

文章标签：前端数据库 ios

本文链接：https://blog.csdn.net/CrystalLawson/article/details/139604211

版权

在这里插入图片描述

前端（Web） - HTML/CSS/JavaScript
HTML (index.html)grsyzp.cn

html

Simple App

Welcome to My Simple App

Click Me CSS (styles.css)

css
body {
font-family: Arial, sans-serif;
text-align: center;
padding-top: 50px;
}

button {
padding: 10px 20px;
font-size: 16px;
}
JavaScript (app.js)

javascript
document.getElementById(‘myButton’).addEventListener(‘click’, function() {
alert(‘Button clicked!’);
});
2. 后端（Node.js） - Express
app.js

javascript
const express = require(‘express’);
const app = express();
const PORT = process.env.PORT || 3000;

app.get(‘/’, (req, res) => {
res.send(‘Hello from the backend!’);
});

app.listen(PORT, () => {
console.log(Server is running on port ${PORT}.);
});
3. 移动端（Android） - Java (使用Android Studio)
这里只展示一个MainActivity.java的简化部分，因为它需要整个Android项目结构来完整运行。

MainActivity.java

java
package com.example.myapp;

import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

@Override  
protected void onCreate(Bundle savedInstanceState) {  
    super.onCreate(savedInstanceState);  
    setContentView(R.layout.activity_main);  

    Button button = findViewById(R.id.myButton);  
    button.setOnClickListener(new View.OnClickListener() {  
        @Override  
        public void onClick(View v) {  
            Toast.makeText(MainActivity.this, "Button clicked!", Toast.LENGTH_SHORT).show();  
        }  
    });  
}

}
activity_main.xml (布局文件)

xml

<Button  
    android:id="@+id/myButton"  
    android:layout_width="wrap_content"  
    android:layout_height="wrap_content"  
    android:text="Click Me"  
    android:layout_centerInParent="true"/>

4. 移动端（iOS） - Swift (使用Xcode) 同样地，这里只展示一个ViewController.swift的简化部分，因为它需要整个Xcode项目来完整运行。

ViewController.swift

swift
import UIKit

class ViewController: UIViewController {

@IBOutlet weak var myButton: UIButton!  

override func viewDidLoad() {  
    super.viewDidLoad()  
    // Do any additional setup after loading the view.  

    myButton.addTarget(self, action: #selector(buttonClicked), for: .touchUpInside)  
}  

@objc func buttonClicked() {  
    let alert = UIAlertController(title: "Alert", message: "Button clicked!", preferredStyle: .alert)  
    let action =

由于一个完整的App涉及多个部分（如前端、后端、数据库等），并且不同平台（如iOS、Android、Web）使用不同的技术和工具，所以在这里我将提供一个非常简化的示例，用几种不同的编程语言来展示如何开始构建一个简单的App的不同部分。

前端（Web） - HTML/CSS/JavaScript
HTML (index.html)